Get rid of Google Developers language change to English

I don’t know if I’m the only that suffer of this issue but as I’m french I often get the language of the https://developers.google.com/ website changed to French even if I set English some times before.

This is not a big issue but translation is done automatically and when you read API details it is not really convenient for a developer.

So I decided to solve this issue with a Chrome Extension, I ask some Google questions to Gemini Pro and check some answers on Stackoverflow and I finnaly get the extension that change automatically the lang of the developer site to English 🥳

The Chrome Extension code

Create a folder on your computer with 2 files :

• manifest.json
• content.js

manifest.json

{
  "manifest_version": 3,
  "name": "Google Developers always in English",
  "version": "1.0",
  "permissions": [
    "activeTab"
  ],
  "content_scripts": [
    {
      "matches": ["https://developers.google.com/*","https://cloud.google.com/*"],
      "js": ["./content.js"]
    }
  ]
}

content.js

window.addEventListener ("load", main, false);

function main (evt) {
  //console.log('We are in the chrome extension');
  const ul = document.querySelector('ul[role="presentation"]')
  const current = ul.querySelector('a[aria-current="true"]');
  const lang = current.textContent;
  if(lang != "English"){
    const english = ul.querySelector('a[lang="en"]');
    // current.removeAttribute('aria-current');
    // english.setAttribute('aria-current', 'true');
    simulateClick(english)
    console.log('We change lang '+lang+' to English !!!');
  }else{
    // console.log('No change !')
 }
}

function simulateClick(item) {
  // From https://stackoverflow.com/a/49930642 
  item.dispatchEvent(new PointerEvent('pointerdown', {bubbles: true}));
  item.dispatchEvent(new MouseEvent('mousedown', {bubbles: true}));
  item.dispatchEvent(new PointerEvent('pointerup', {bubbles: true}));
  item.dispatchEvent(new MouseEvent('mouseup', {bubbles: true}));
  item.dispatchEvent(new MouseEvent('mouseout', {bubbles: true}));
  item.dispatchEvent(new MouseEvent('click', {bubbles: true}));
  item.dispatchEvent(new Event('change', {bubbles: true}));

  return true;
}

Chrome extension installation

1. Now go to : chrome://extensions/

2. Activate developer mode if needed atthe top right

3. Click on “load unpacked extension” and select folder created before

And that’s all.

Now when you will go to https://developers.google.com/ or https://cloud.google.com/ and if the lang is not English, the extension will do the change for you.

I hope this will help others people 😄