In this article, we are going to create a Chrome extension that will help us to automate the Ask-To-Join screen in Google meets using JavaScript. This extension helps us to automatically turn off the audio and video button in the Google meet and after that, it will automatically click on the ask to join button.
Let’s start with the project:
Step 1: Firstly you need to make a manifest.json file for your Chrome extension, Let’s create it.
{ "name": "automatic class joiner", "version": "1.0", "manifest_version": 2, "content_scripts": [{ "matches": [""], "js": ["content.js"] }], "browser_action": { "default_popup": "popup.html", "default_title": "automatic class joiner" } }
Here we are done with our manifest file. Whenever a new URL open the manifest file will run a script named as content.js
Step 2: Now let create a simple frontend for our Chrome extension. We create a new HTML file named popup.html.
HTML
<!DOCTYPE html> < html > < head > < title >Online class joiner</ title > < link rel = "stylesheet" href = "online.css" type = "text/css" /> </ head > < body > < h2 >Joiner Active</ h2 > < p > You will automatically join the classes when this extension is ON. </ p > </ body > </ html > |
Now we are done with the frontend part, let’s build the main functionality of the extension i.e. content.js script file.
Step 3: Now we have to create a new file named content.js
Javascript
function start() { url = location.href; if (url.includes( "meet.google.com" )) { its_meet(); } } function its_meet() { items = document.getElementsByTagName( 'div' ); setTimeout( function () { try { for (i = 0; i < items.length; i++) { if (items[i].hasAttribute( "aria-label" )) { if (items[i].getAttribute( "aria-label" ) .includes( "microphone" ) || items[i].getAttribute( "aria-label" ) .includes( "camera" )) { items[i].click(); } } } } catch (err) { console.log(err); } }, 5000) setTimeout( function () { for (i = 0; i < items.length; i++) { if (items[i].hasAttribute( "jsname" )) { if (items[i].getAttribute( "jsname" ) .includes( "Qx7uuf" )) { items[i].click(); } } } }, 8000); } start(); |
After doing that much work, we are done with our extension.
Step 4: Let’s try to run it.
Firstly you need to add it into your extensions in Google chrome and after that just relax and let the extension do the job.
Output:
For the GitHub repo, please click https://github.com/Abhishek07Kalra/AutomaticClassJoiner