Search code examples
javascriptbrowserbookmarklet

Javascript: How to create a browser bookmarklet to edit a file in Github?


I have a javascript bookmarklet that helps me in committing GitHub commit:

 document.getElementById('submit-file').click();. 

I was wondering how to make a similar bookmarklet to EDIT the GitHub file?

I am new to javascript and still in the learning phase so this is kind of taking days me to figure out how to do this

Update as per comments

FWIW, In fact, I was trying to modify an Alfred workflow (MacOS application to automate tasks) and the app allows us to click the "commit" button in github pages and I was trying to modify it so that now I can edit the current document in github.

Outline of app:

First part:

document.getElementById('submit-file').click();

Second part:

const bookmarklet_code="{query}"
const frontmost_app_name = Application('System Events').applicationProcesses.where({ frontmost: true }).name()[0]
const frontmost_app = Application(frontmost_app_name)

if (['Google Chrome','Google Chrome Canary','Chromium'].indexOf(frontmost_app_name) > -1) {
  frontmost_app.windows[0].activeTab.url = 'javascript:' + bookmarklet_code
} else if (['Safari', 'Safari Technology Preview', 'Webkit'].indexOf(frontmost_app_name) > -1) {
  frontmost_app.doJavaScript(bookmarklet_code, { in: frontmost_app.documents[0] })
} else {
  throw new Error('You need a supported browser as your frontmost app')
}

Solution

  • Try this bookmarklet:

    javascript:document.querySelector('[aria-label="Edit this file"]').click();
    

    It finds the Edit button based on Aria-Label and clicks it.