The GLIB-Chrome-Ext challenges are a set of challenges where we will be building out a chrome extension that inserts a button onto various vendor (Github, Gitlab, Jira, etc) sites in order to launch a new Topcoder challenge(s). This this challenged we will be altering the code that does the button injection as it is currently causing the page to freeze up on Github after a period of time. We will be updating the extension to use chome events that are triggered on updates to the page that will check the url on updates and only inject the styles and button when the appropriate url is detected.
Requirements:
Add tabs to the permission object in the manifest.
In the background.js script add a chrome.tabs.onUpdated event handler that will check the current url to determine if the styles need to be injected and button added. Note the event will fire multiple times for a single page navigation (such as clicking issues in github). Your code should verify that the styles and button have not already been injected for the current view.
Use the chrome.tab.injectCss function add the required styles to the active tab.
Update the code to add the button to the page when necessary. This can either be done using something like chome.tab.executeScript (note there will need to be a custom setup per vendor), or by firing an event to be handled in the contest_script.js that will use the current button injection code.
Depending on your implementation update or removed the code in the content_script that is no longer necessary. Note that the purpose of this challenge is to remove the setInterval functions from the button injects so be sure that those are removed.
Update the code that is executed on load, removing the button and style inject checks.
It would be ideal if the `chome.tab.onUpdated listener was only added when a valid vendor is detected. Explore this possibility and document in your submission if you were not able to accomplish this goal.
Add a common logging function that uses console.log, but will only log out when the extension in developer mode. You added function should use this logging function to console.log out statements indicating execution in the extension.
Ensure that the gulpfile tasks and scripts in package.json all still pass after you updates. You should add unit test for added functionality.
Setup & Reference:
Use dev mode when working on the extension locally. This is configured in the options of the extension.
See the README for details around running the extension locally.
For dev mode you are able to enter any value for the project id when prompted.
Description:
The GLIB-Chrome-Ext challenges are a set of challenges where we will be building out a chrome extension that inserts a button onto various vendor (Github, Gitlab, Jira, etc) sites in order to launch a new Topcoder challenge(s). This this challenged we will be altering the code that does the button injection as it is currently causing the page to freeze up on Github after a period of time. We will be updating the extension to use chome events that are triggered on updates to the page that will check the url on updates and only inject the styles and button when the appropriate url is detected.
Requirements:
chrome.tabs.onUpdated
event handler that will check the current url to determine if the styles need to be injected and button added. Note the event will fire multiple times for a single page navigation (such as clicking issues in github). Your code should verify that the styles and button have not already been injected for the current view.Setup & Reference:
Submissions: