Replace var with let in examples (#484)

* Replace var with let in examples store-collected-images/webextension-plain/deps/uuidv4.js * Reverted third–party code
2026-04-16 06:18:35 +02:00 · 2022-08-11 04:27:28 +12:00
parent 1c0a24b2a6
commit 82217a05bc
42 changed files with 136 additions and 136 deletions
--- a/annotate-page/sidebar/panel.js
+++ b/annotate-page/sidebar/panel.js
@@ -1,4 +1,4 @@
-var myWindowId;
+let myWindowId;
 const contentBox = document.querySelector("#content");

 /*
--- a/apply-css/background.js
+++ b/apply-css/background.js
@@ -21,7 +21,7 @@ function toggleCSS(tab) {
    }
  }

-  var gettingTitle = browser.pageAction.getTitle({tabId: tab.id});
+  let gettingTitle = browser.pageAction.getTitle({tabId: tab.id});
  gettingTitle.then(gotTitle);
 }

@@ -49,7 +49,7 @@ function initializePageAction(tab) {
 /*
 When first loaded, initialize the page action for all tabs.
 */
-var gettingAllTabs = browser.tabs.query({});
+let gettingAllTabs = browser.tabs.query({});
 gettingAllTabs.then((tabs) => {
  for (let tab of tabs) {
    initializePageAction(tab);
--- a/bookmark-it/background.js
+++ b/bookmark-it/background.js
@@ -1,5 +1,5 @@
-var currentTab;
-var currentBookmark;
+let currentTab;
+let currentBookmark;

 /*
 * Updates the browserAction icon to reflect whether the current page
@@ -42,8 +42,8 @@ browser.browserAction.onClicked.addListener(toggleBookmark);
 function updateActiveTab(tabs) {

  function isSupportedProtocol(urlString) {
-    var supportedProtocols = ["https:", "http:", "ftp:", "file:"];
-    var url = document.createElement('a');
+    let supportedProtocols = ["https:", "http:", "ftp:", "file:"];
+    let url = document.createElement('a');
    url.href = urlString;
    return supportedProtocols.indexOf(url.protocol) != -1;
  }
@@ -52,7 +52,7 @@ function updateActiveTab(tabs) {
    if (tabs[0]) {
      currentTab = tabs[0];
      if (isSupportedProtocol(currentTab.url)) {
-        var searching = browser.bookmarks.search({url: currentTab.url});
+        let searching = browser.bookmarks.search({url: currentTab.url});
        searching.then((bookmarks) => {
          currentBookmark = bookmarks[0];
          updateIcon();
@@ -63,7 +63,7 @@ function updateActiveTab(tabs) {
    }
  }

-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
+  let gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
  gettingActiveTab.then(updateTab);
 }

--- a/chill-out/background.js
+++ b/chill-out/background.js
@@ -8,13 +8,13 @@ in the console, but the alarm will still go off after 6 seconds
 * if you package the extension and install it, then the alarm will go off after
 a minute.
 */
-var DELAY = 0.1;
-var CATGIFS = "https://giphy.com/explore/cat";
+let DELAY = 0.1;
+let CATGIFS = "https://giphy.com/explore/cat";

 /*
 Restart alarm for the currently active tab, whenever background.js is run.
 */
-var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
+let gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
 gettingActiveTab.then((tabs) => {
  restartAlarm(tabs[0].id);
 });
@@ -26,7 +26,7 @@ browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (!changeInfo.url) {
    return;
  }
-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
+  let gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
  gettingActiveTab.then((tabs) => {
    if (tabId == tabs[0].id) {
      restartAlarm(tabId);
@@ -48,7 +48,7 @@ then set a new alarm for the given tab.
 function restartAlarm(tabId) {
  browser.pageAction.hide(tabId);
  browser.alarms.clearAll();
-  var gettingTab = browser.tabs.get(tabId);
+  let gettingTab = browser.tabs.get(tabId);
  gettingTab.then((tab) => {
    if (tab.url != CATGIFS) {
      browser.alarms.create("", {delayInMinutes: DELAY});
@@ -60,7 +60,7 @@ function restartAlarm(tabId) {
 On alarm, show the page action.
 */
 browser.alarms.onAlarm.addListener((alarm) => {
-  var gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
+  let gettingActiveTab = browser.tabs.query({active: true, currentWindow: true});
  gettingActiveTab.then((tabs) => {
    browser.pageAction.show(tabs[0].id);
  });
--- a/content-script-register/background.js
+++ b/content-script-register/background.js
@@ -1,6 +1,6 @@
 'use strict';

-var registered = null;
+let registered = null;

 async function registerScript(message) {

--- a/contextual-identities/context.js
+++ b/contextual-identities/context.js
@@ -27,7 +27,7 @@ function createOptions(node, identity) {
  }
 }

-var div = document.getElementById('identity-list');
+let div = document.getElementById('identity-list');

 if (browser.contextualIdentities === undefined) {
  div.innerText = 'browser.contextualIdentities not available. Check that the privacy.userContext.enabled pref is set to true, and reload the add-on.';
--- a/cookie-bg-picker/background_scripts/background.js
+++ b/cookie-bg-picker/background_scripts/background.js
@@ -7,13 +7,13 @@ function getActiveTab() {
 function cookieUpdate() {
  getActiveTab().then((tabs) => {
    // get any previously set cookie for the current tab 
-    var gettingCookies = browser.cookies.get({
+    let gettingCookies = browser.cookies.get({
      url: tabs[0].url,
      name: "bgpicker"
    });
    gettingCookies.then((cookie) => {
      if (cookie) {
-        var cookieVal = JSON.parse(cookie.value);
+        let cookieVal = JSON.parse(cookie.value);
        browser.tabs.sendMessage(tabs[0].id, {image: cookieVal.image});
        browser.tabs.sendMessage(tabs[0].id, {color: cookieVal.color});
      }
--- a/cookie-bg-picker/content_scripts/updatebg.js
+++ b/cookie-bg-picker/content_scripts/updatebg.js
@@ -1,8 +1,8 @@
 browser.runtime.onMessage.addListener(updateBg);

 function updateBg(request, sender, sendResponse) {
-  var html = document.querySelector('html');
-  var body = document.querySelector('body');
+  let html = document.querySelector('html');
+  let body = document.querySelector('body');
  if (request.image) {
    html.style.backgroundImage = 'url(' + request.image + ')';
    body.style.backgroundImage = 'url(' + request.image + ')';
--- a/cookie-bg-picker/popup/bgpicker.js
+++ b/cookie-bg-picker/popup/bgpicker.js
@@ -1,9 +1,9 @@
 /* initialise variables */

-var bgBtns = document.querySelectorAll('.bg-container button');
-var colorPick = document.querySelector('input');
-var reset = document.querySelector('.color-reset button');
-var cookieVal = { image : '',
+let bgBtns = document.querySelectorAll('.bg-container button');
+let colorPick = document.querySelector('input');
+let reset = document.querySelector('.color-reset button');
+let cookieVal = { image : '',
                  color : '' };

 function getActiveTab() {
@@ -13,15 +13,15 @@ function getActiveTab() {
 /* apply backgrounds to buttons */
 /* add listener so that when clicked, button applies background to page HTML */

-for(var i = 0; i < bgBtns.length; i++) {
-  var imgName = bgBtns[i].getAttribute('class');
-  var bgImg = 'url(\'images/' + imgName + '.png\')';
+for(let i = 0; i < bgBtns.length; i++) {
+  let imgName = bgBtns[i].getAttribute('class');
+  let bgImg = 'url(\'images/' + imgName + '.png\')';
  bgBtns[i].style.backgroundImage = bgImg;

  bgBtns[i].onclick = function(e) {
    getActiveTab().then((tabs) => {
-      var imgName = e.target.getAttribute('class');
-      var fullURL = browser.extension.getURL('popup/images/'+ imgName + '.png');
+      let imgName = e.target.getAttribute('class');
+      let fullURL = browser.extension.getURL('popup/images/'+ imgName + '.png');
      browser.tabs.sendMessage(tabs[0].id, {image: fullURL});

      cookieVal.image = fullURL;
@@ -38,7 +38,7 @@ for(var i = 0; i < bgBtns.length; i++) {

 colorPick.onchange = function(e) {
  getActiveTab().then((tabs) => {
-    var currColor = e.target.value;
+    let currColor = e.target.value;
    browser.tabs.sendMessage(tabs[0].id, {color: currColor});

    cookieVal.color = currColor;
--- a/dynamic-theme/background.js
+++ b/dynamic-theme/background.js
@@ -1,4 +1,4 @@
-var currentTheme = '';
+let currentTheme = '';

 const themes = {
  'day': {
--- a/eslint-example/main.js
+++ b/eslint-example/main.js
@@ -4,7 +4,7 @@
 /* global getUsefulContents */
 function start() {
   getUsefulContents(data => {
-       var display = document.getElementById('display');
+       let display = document.getElementById('display');

       display.innerHTML = data;
   });
--- a/export-helpers/content_scripts/export.js
+++ b/export-helpers/content_scripts/export.js
@@ -16,7 +16,7 @@ exportFunction(notify, window, {defineAs:'notify'});
 * Because the object contains functions, the cloneInto call must include
 * the `cloneFunctions` option.
 */
-var messenger = {
+let messenger = {
  notify: function(message) {
    browser.runtime.sendMessage({content: "Object method call: " + message});
  }
--- a/favourite-colour/options.js
+++ b/favourite-colour/options.js
@@ -6,12 +6,12 @@ function saveOptions(e) {
 }

 function restoreOptions() {
-  var storageItem = browser.storage.managed.get('colour');
+  let storageItem = browser.storage.managed.get('colour');
  storageItem.then((res) => {
    document.querySelector("#managed-colour").innerText = res.colour;
  });

-  var gettingItem = browser.storage.sync.get('colour');
+  let gettingItem = browser.storage.sync.get('colour');
  gettingItem.then((res) => {
    document.querySelector("#colour").value = res.colour || 'Firefox red';
  });
--- a/forget-it/background.js
+++ b/forget-it/background.js
@@ -1,7 +1,7 @@
 /*
 Default settings. If there is nothing in storage, use these values.
 */
-var defaultSettings = {
+let defaultSettings = {
  since: "hour",
  dataTypes: ["history", "downloads"]
 };
--- a/history-deleter/history.js
+++ b/history-deleter/history.js
@@ -1,6 +1,6 @@
 // A useful way to extract the domain from a url.
 function get_hostname(url) {
-  var a = document.createElement('a');
+  let a = document.createElement('a');
  a.href = url;
  set_domain(a.hostname);
  return a.hostname;
@@ -14,7 +14,7 @@ function set_domain(domain) {
 }

 function no_history(hostname) {
-  var history_text = document.getElementById('history');
+  let history_text = document.getElementById('history');
  while(history_text.firstChild)
    history_text.removeChild(history_text.firstChild);
  history_text.textContent = `No history for ${hostname}.`;
@@ -27,22 +27,22 @@ function getActiveTab() {
 // When the page is loaded find the current tab and then use that to query
 // the history.
 getActiveTab().then((tabs) => {
-  var list = document.getElementById('history');
-  var hostname = get_hostname(tabs[0].url);
+  let list = document.getElementById('history');
+  let hostname = get_hostname(tabs[0].url);

  // Search for all history entries for the current windows domain.
  // Because this could be a lot of entries, lets limit it to 5.
-  var searchingHistory = browser.history.search({text: hostname, maxResults: 5});
+  let searchingHistory = browser.history.search({text: hostname, maxResults: 5});
  searchingHistory.then((results) => {
    // What to show if there are no results.
    if (results.length < 1) {
      no_history(hostname);
    } else {
-      for (var k in results) {
-        var history = results[k];
-        var li = document.createElement('p');
-        var a = document.createElement('a');
-        var url = document.createTextNode(history.url);
+      for (let k in results) {
+        let history = results[k];
+        let li = document.createElement('p');
+        let a = document.createElement('a');
+        let url = document.createTextNode(history.url);
        a.href = history.url;
        a.target = '_blank';
        a.appendChild(url);
@@ -55,7 +55,7 @@ getActiveTab().then((tabs) => {

 function clearAll(e) {
  getActiveTab().then((tabs) => {
-    var hostname = get_hostname(tabs[0].url);
+    let hostname = get_hostname(tabs[0].url);
    if (!hostname) {
      // Don't try and delete history when there's no hostname.
      return;
@@ -63,7 +63,7 @@ function clearAll(e) {

    // Search will return us a list of histories for this domain.
    // Loop through them and delete them one by one.
-    var searchingHistory = browser.history.search({text: hostname})
+    let searchingHistory = browser.history.search({text: hostname})
    searchingHistory.then((results) => {
        for (let k in results) {
          browser.history.deleteUrl({url: results[k].url});
--- a/latest-download/popup/latest_download.js
+++ b/latest-download/popup/latest_download.js
@@ -1,12 +1,12 @@

-var latestDownloadId;
+let latestDownloadId;

 /*
 Callback from getFileIcon.
 Initialize the displayed icon.
 */
 function updateIconUrl(iconUrl) {
-  var downloadIcon = document.querySelector("#icon");
+  let downloadIcon = document.querySelector("#icon");
  downloadIcon.setAttribute("src", iconUrl);
 }

@@ -22,10 +22,10 @@ If there was a download item,
 If there wasn't a download item, disable the "open" and "remove" buttons.
 */
 function initializeLatestDownload(downloadItems) {
-  var downloadUrl = document.querySelector("#url");
+  let downloadUrl = document.querySelector("#url");
  if (downloadItems.length > 0) {
    latestDownloadId = downloadItems[0].id;
-    var gettingIconUrl = browser.downloads.getFileIcon(latestDownloadId);
+    let gettingIconUrl = browser.downloads.getFileIcon(latestDownloadId);
    gettingIconUrl.then(updateIconUrl, onError);
    downloadUrl.textContent = downloadItems[0].url;
    document.querySelector("#open").classList.remove("disabled");
@@ -40,7 +40,7 @@ function initializeLatestDownload(downloadItems) {
 /*
 Search for the most recent download, and pass it to initializeLatestDownload()
 */
-var searching = browser.downloads.search({
+let searching = browser.downloads.search({
  limit: 1,
  orderBy: ["-startTime"]
 });
--- a/list-cookies/cookies.js
+++ b/list-cookies/cookies.js
@@ -3,13 +3,13 @@ function showCookiesForTab(tabs) {
  let tab = tabs.pop();

  //get all cookies in the domain
-  var gettingAllCookies = browser.cookies.getAll({url: tab.url});
+  let gettingAllCookies = browser.cookies.getAll({url: tab.url});
  gettingAllCookies.then((cookies) => {

    //set the header of the panel
-    var activeTabUrl = document.getElementById('header-title');
-    var text = document.createTextNode("Cookies at: "+tab.title);
-    var cookieList = document.getElementById('cookie-list');
+    let activeTabUrl = document.getElementById('header-title');
+    let text = document.createTextNode("Cookies at: "+tab.title);
+    let cookieList = document.getElementById('cookie-list');
    activeTabUrl.appendChild(text);

    if (cookies.length > 0) {
--- a/menu-accesskey-visible/background.js
+++ b/menu-accesskey-visible/background.js
@@ -38,7 +38,7 @@ function detectAccessKeyMenuFeature() {
  // on parameter properties.
 }

-var IS_ACCESS_KEY_SUPPORTED = detectAccessKeyMenuFeature();
+let IS_ACCESS_KEY_SUPPORTED = detectAccessKeyMenuFeature();

 function formatMenuLabel(menuLabel) {
  if (!IS_ACCESS_KEY_SUPPORTED) {
--- a/menu-demo/background.js
+++ b/menu-demo/background.js
@@ -77,7 +77,7 @@ browser.menus.create({
  contexts: ["all"]
 }, onCreated);

-var checkedState = true;
+let checkedState = true;

 browser.menus.create({
  id: "check-uncheck",
@@ -106,8 +106,8 @@ Set a colored border on the document in the given tab.
 Note that this only work on normal web pages, not special pages
 like about:debugging.
 */
-var blue = 'document.body.style.border = "5px solid blue"';
-var green = 'document.body.style.border = "5px solid green"';
+let blue = 'document.body.style.border = "5px solid blue"';
+let green = 'document.body.style.border = "5px solid green"';

 function borderify(tabId, color) {
  browser.tabs.executeScript(tabId, {
@@ -146,7 +146,7 @@ browser.menus.onClicked.addListener((info, tab) => {
      console.log(info.selectionText);
      break;
    case "remove-me":
-      var removing = browser.menus.remove(info.menuItemId);
+      let removing = browser.menus.remove(info.menuItemId);
      removing.then(onRemoved, onError);
      break;
    case "bluify":
--- a/menu-remove-element/background.js
+++ b/menu-remove-element/background.js
@@ -1,6 +1,6 @@
 "use strict";

-var popupParameters;
+let popupParameters;

 browser.menus.create({
  id: "remove_element",
--- a/menu-remove-element/contentscript.js
+++ b/menu-remove-element/contentscript.js
@@ -52,7 +52,7 @@
  });
  
  
-  var highlightedBox;
+  let highlightedBox;
  function highlightElement(element) {
    removeHighlights();
    let boundingRect = element.getBoundingClientRect();
--- a/menu-remove-element/menusGetTargetElementPolyfill.js
+++ b/menu-remove-element/menusGetTargetElementPolyfill.js
@@ -18,7 +18,7 @@
 //   if the given first parameter matches the info.targetElementId integer from
 //   the menus.onClicked or menus.onShown events.
 if (!browser.menus || !browser.menus.getTargetElement) {
-  var menuTarget = null;
+  let menuTarget = null;
  let cleanupIfNeeded = () => {
    if (menuTarget && !document.contains(menuTarget)) menuTarget = null;
  };
--- a/mocha-client-tests/addon/background.js
+++ b/mocha-client-tests/addon/background.js
@@ -1,4 +1,4 @@
-var Background = {
+let Background = {
    receiveMessage: function(msg, sender, sendResponse) {
        if (msg && msg.action && Background.hasOwnProperty(msg.action)) {
            return Background[msg.action](msg, sender, sendResponse);
--- a/mocha-client-tests/addon/scripts/popup.js
+++ b/mocha-client-tests/addon/scripts/popup.js
@@ -1,5 +1,5 @@
    setInterval(function() {
-        var $game = document.querySelector('#game');
+        let $game = document.querySelector('#game');
        if($game.innerText !== 'ping'){
            $game.innerText = 'ping';
        } else{
--- a/native-messaging/add-on/background.js
+++ b/native-messaging/add-on/background.js
@@ -1,7 +1,7 @@
 /*
 On startup, connect to the "ping_pong" app.
 */
-var port = browser.runtime.connectNative("ping_pong");
+let port = browser.runtime.connectNative("ping_pong");

 /*
 Listen for messages from the app.
--- a/navigation-stats/background.js
+++ b/navigation-stats/background.js
@@ -1,5 +1,5 @@
 // Load existent stats with the storage API.
-var gettingStoredStats = browser.storage.local.get();
+let gettingStoredStats = browser.storage.local.get();

 gettingStoredStats.then(results => {
  // Initialize the saved stats if not yet initialized.
--- a/navigation-stats/popup.js
+++ b/navigation-stats/popup.js
@@ -23,7 +23,7 @@ function addElements(element, array, callback) {
  }
 }

-var gettingStoredStats = browser.storage.local.get();
+let gettingStoredStats = browser.storage.local.get();
 gettingStoredStats.then(results => {
  if (results.type.length === 0 || results.host.length === 0) {
    return;
--- a/notify-link-clicks-i18n/background-script.js
+++ b/notify-link-clicks-i18n/background-script.js
@@ -5,8 +5,8 @@ which we read from the message.
 */
 function notify(message) {
  console.log("background script received message");
-  var title = browser.i18n.getMessage("notificationTitle");
-  var content = browser.i18n.getMessage("notificationContent", message.url);
+  let title = browser.i18n.getMessage("notificationTitle");
+  let content = browser.i18n.getMessage("notificationContent", message.url);
  browser.notifications.create({
    "type": "basic",
    "iconUrl": browser.extension.getURL("icons/link-48.png"),
--- a/notify-link-clicks-i18n/content-script.js
+++ b/notify-link-clicks-i18n/content-script.js
@@ -3,7 +3,7 @@ If the click was on a link, send a message to the background page.
 The message contains the link's URL.
 */
 function notifyExtension(e) {
-  var target = e.target;
+  let target = e.target;
  while ((target.tagName != "A" || !target.href) && target.parentNode) {
    target = target.parentNode;
  }
--- a/page-to-extension-messaging/content-script.js
+++ b/page-to-extension-messaging/content-script.js
@@ -24,5 +24,5 @@ function messagePageScript() {
 Add messagePageScript() as a listener to click events on
 the "from-content-script" element.
 */
-var fromContentScript = document.getElementById("from-content-script");
+let fromContentScript = document.getElementById("from-content-script");
 fromContentScript.addEventListener("click", messagePageScript);
--- a/quicknote/popup/quicknote.js
+++ b/quicknote/popup/quicknote.js
@@ -1,13 +1,13 @@
 /* initialise variables */

-var inputTitle = document.querySelector('.new-note input');
-var inputBody = document.querySelector('.new-note textarea');
+let inputTitle = document.querySelector('.new-note input');
+let inputBody = document.querySelector('.new-note textarea');

-var noteContainer = document.querySelector('.note-container');
+let noteContainer = document.querySelector('.note-container');


-var clearBtn = document.querySelector('.clear');
-var addBtn = document.querySelector('.add');
+let clearBtn = document.querySelector('.clear');
+let addBtn = document.querySelector('.add');

 /*  add event listeners to buttons */

@@ -24,11 +24,11 @@ function onError(error) {
 initialize();

 function initialize() {
-  var gettingAllStorageItems = browser.storage.local.get(null);
+  let gettingAllStorageItems = browser.storage.local.get(null);
  gettingAllStorageItems.then((results) => {
-    var noteKeys = Object.keys(results);
+    let noteKeys = Object.keys(results);
    for (let noteKey of noteKeys) {
-      var curValue = results[noteKey];
+      let curValue = results[noteKey];
      displayNote(noteKey,curValue);
    }
  }, onError);
@@ -37,11 +37,11 @@ function initialize() {
 /* Add a note to the display, and storage */

 function addNote() {
-  var noteTitle = inputTitle.value;
-  var noteBody = inputBody.value;
-  var gettingItem = browser.storage.local.get(noteTitle);
+  let noteTitle = inputTitle.value;
+  let noteBody = inputBody.value;
+  let gettingItem = browser.storage.local.get(noteTitle);
  gettingItem.then((result) => {
-    var objTest = Object.keys(result);
+    let objTest = Object.keys(result);
    if(objTest.length < 1 && noteTitle !== '' && noteBody !== '') {
      inputTitle.value = '';
      inputBody.value = '';
@@ -53,7 +53,7 @@ function addNote() {
 /* function to store a new note in storage */

 function storeNote(title, body) {
-  var storingNote = browser.storage.local.set({ [title] : body });
+  let storingNote = browser.storage.local.set({ [title] : body });
  storingNote.then(() => {
    displayNote(title,body);
  }, onError);
@@ -64,12 +64,12 @@ function storeNote(title, body) {
 function displayNote(title, body) {

  /* create note display box */
-  var note = document.createElement('div');
-  var noteDisplay = document.createElement('div');
-  var noteH = document.createElement('h2');
-  var notePara = document.createElement('p');
-  var deleteBtn = document.createElement('button');
-  var clearFix = document.createElement('div');
+  let note = document.createElement('div');
+  let noteDisplay = document.createElement('div');
+  let noteH = document.createElement('h2');
+  let notePara = document.createElement('p');
+  let deleteBtn = document.createElement('button');
+  let clearFix = document.createElement('div');

  note.setAttribute('class','note');

@@ -95,13 +95,13 @@ function displayNote(title, body) {
  })

  /* create note edit box */
-  var noteEdit = document.createElement('div');
-  var noteTitleEdit = document.createElement('input');
-  var noteBodyEdit = document.createElement('textarea');
-  var clearFix2 = document.createElement('div');
+  let noteEdit = document.createElement('div');
+  let noteTitleEdit = document.createElement('input');
+  let noteBodyEdit = document.createElement('textarea');
+  let clearFix2 = document.createElement('div');

-  var updateBtn = document.createElement('button');
-  var cancelBtn = document.createElement('button');
+  let updateBtn = document.createElement('button');
+  let cancelBtn = document.createElement('button');

  updateBtn.setAttribute('class','update');
  updateBtn.textContent = 'Update note';
@@ -154,10 +154,10 @@ function displayNote(title, body) {
 /* function to update notes */

 function updateNote(delNote,newTitle,newBody) {
-  var storingNote = browser.storage.local.set({ [newTitle] : newBody });
+  let storingNote = browser.storage.local.set({ [newTitle] : newBody });
  storingNote.then(() => {
    if(delNote !== newTitle) {
-      var removingNote = browser.storage.local.remove(delNote);
+      let removingNote = browser.storage.local.remove(delNote);
      removingNote.then(() => {
        displayNote(newTitle, newBody);
      }, onError);
--- a/root-cert-stats/background.js
+++ b/root-cert-stats/background.js
@@ -1,6 +1,6 @@
 "use strict";

-var rootCertStats = {};
+let rootCertStats = {};

 /*
 On an onHeadersReceived event, if there was a successful TLS connection
--- a/selection-to-clipboard/content-script.js
+++ b/selection-to-clipboard/content-script.js
@@ -2,7 +2,7 @@
 copy the selected text to clipboard
 */
 function copySelection() {
-    var selectedText = window.getSelection().toString().trim();
+    let selectedText = window.getSelection().toString().trim();

    if (selectedText) {
        document.execCommand("Copy");
--- a/stored-credentials/auth.js
+++ b/stored-credentials/auth.js
@@ -1,14 +1,14 @@

-var target = "https://httpbin.org/basic-auth/*";
+let target = "https://httpbin.org/basic-auth/*";

-var pendingRequests = [];
+let pendingRequests = [];

 /*
 A request has completed. We can stop worrying about it.
 */
 function completed(requestDetails) {
  console.log("completed: " + requestDetails.requestId);
-  var index = pendingRequests.indexOf(requestDetails.requestId);
+  let index = pendingRequests.indexOf(requestDetails.requestId);
  if (index > -1) {
    pendingRequests.splice(index, 1);
  }
--- a/stored-credentials/storage.js
+++ b/stored-credentials/storage.js
@@ -1,7 +1,7 @@
 /*
 Default settings. Initialize storage to these values.
 */
-var authCredentials = {
+let authCredentials = {
  username: "user",
  password: "passwd"
 }
--- a/tabs-tabs-tabs/tabs.js
+++ b/tabs-tabs-tabs/tabs.js
@@ -5,7 +5,7 @@ const MIN_ZOOM = 0.3;
 const DEFAULT_ZOOM = 1;

 function firstUnpinnedTab(tabs) {
-  for (var tab of tabs) {
+  for (let tab of tabs) {
    if (!tab.pinned) {
      return tab.index;
    }
@@ -50,7 +50,7 @@ function getCurrentWindowTabs() {
 document.addEventListener("click", (e) => {
  function callOnActiveTab(callback) {
    getCurrentWindowTabs().then((tabs) => {
-      for (var tab of tabs) {
+      for (let tab of tabs) {
        if (tab.active) {
          callback(tab, tabs);
        }
@@ -60,7 +60,7 @@ document.addEventListener("click", (e) => {

  if (e.target.id === "tabs-move-beginning") {
    callOnActiveTab((tab, tabs) => {
-      var index = 0;
+      let index = 0;
      if (!tab.pinned) {
        index = firstUnpinnedTab(tabs);
      }
@@ -71,9 +71,9 @@ document.addEventListener("click", (e) => {

  if (e.target.id === "tabs-move-end") {
    callOnActiveTab((tab, tabs) => {
-      var index = -1;
+      let index = -1;
      if (tab.pinned) {
-        var lastPinnedTab = Math.max(0, firstUnpinnedTab(tabs) - 1);
+        let lastPinnedTab = Math.max(0, firstUnpinnedTab(tabs) - 1);
        index = lastPinnedTab;
      }
      browser.tabs.move([tab.id], {index});
@@ -118,13 +118,13 @@ document.addEventListener("click", (e) => {

  else if (e.target.id === "tabs-add-zoom") {
    callOnActiveTab((tab) => {
-      var gettingZoom = browser.tabs.getZoom(tab.id);
+      let gettingZoom = browser.tabs.getZoom(tab.id);
      gettingZoom.then((zoomFactor) => {
        //the maximum zoomFactor is 5, it can't go higher
        if (zoomFactor >= MAX_ZOOM) {
          alert("Tab zoom factor is already at max!");
        } else {
-          var newZoomFactor = zoomFactor + ZOOM_INCREMENT;
+          let newZoomFactor = zoomFactor + ZOOM_INCREMENT;
          //if the newZoomFactor is set to higher than the max accepted
          //it won't change, and will never alert that it's at maximum
          newZoomFactor = newZoomFactor > MAX_ZOOM ? MAX_ZOOM : newZoomFactor;
@@ -136,13 +136,13 @@ document.addEventListener("click", (e) => {

  else if (e.target.id === "tabs-decrease-zoom") {
    callOnActiveTab((tab) => {
-      var gettingZoom = browser.tabs.getZoom(tab.id);
+      let gettingZoom = browser.tabs.getZoom(tab.id);
      gettingZoom.then((zoomFactor) => {
        //the minimum zoomFactor is 0.3, it can't go lower
        if (zoomFactor <= MIN_ZOOM) {
          alert("Tab zoom factor is already at minimum!");
        } else {
-          var newZoomFactor = zoomFactor - ZOOM_INCREMENT;
+          let newZoomFactor = zoomFactor - ZOOM_INCREMENT;
          //if the newZoomFactor is set to lower than the min accepted
          //it won't change, and will never alert that it's at minimum
          newZoomFactor = newZoomFactor < MIN_ZOOM ? MIN_ZOOM : newZoomFactor;
@@ -154,7 +154,7 @@ document.addEventListener("click", (e) => {

  else if (e.target.id === "tabs-default-zoom") {
    callOnActiveTab((tab) => {
-      var gettingZoom = browser.tabs.getZoom(tab.id);
+      let gettingZoom = browser.tabs.getZoom(tab.id);
      gettingZoom.then((zoomFactor) => {
        if (zoomFactor == DEFAULT_ZOOM) {
          alert("Tab zoom is already at the default zoom factor");
@@ -166,12 +166,12 @@ document.addEventListener("click", (e) => {
  }

  else if (e.target.classList.contains('switch-tabs')) {
-    var tabId = +e.target.getAttribute('href');
+    let tabId = +e.target.getAttribute('href');

    browser.tabs.query({
      currentWindow: true
    }).then((tabs) => {
-      for (var tab of tabs) {
+      for (let tab of tabs) {
        if (tab.id === tabId) {
          browser.tabs.update(tabId, {
              active: true
@@ -197,7 +197,7 @@ browser.tabs.onRemoved.addListener((tabId, removeInfo) => {

 //onMoved listener. fired when tab is moved into the same window
 browser.tabs.onMoved.addListener((tabId, moveInfo) => {
-  var startIndex = moveInfo.fromIndex;
-  var endIndex = moveInfo.toIndex;
+  let startIndex = moveInfo.fromIndex;
+  let endIndex = moveInfo.toIndex;
  console.log(`Tab with id: ${tabId} moved from index: ${startIndex} to index: ${endIndex}`);
 });
--- a/theme-switcher/switcher.js
+++ b/theme-switcher/switcher.js
@@ -1,4 +1,4 @@
-var themeList = document.getElementById('theme-list');
+let themeList = document.getElementById('theme-list');

 function enableTheme(e) {
  browser.management.setEnabled(e.target.value, true);
--- a/top-sites/sites.js
+++ b/top-sites/sites.js
@@ -1,6 +1,6 @@
 browser.topSites.get()
  .then((sites) => {
-    var div = document.getElementById('site-list');
+    let div = document.getElementById('site-list');

    if (!sites.length) {
      div.innerText = 'No sites returned from the topSites API.';
--- a/user-agent-rewriter/background.js
+++ b/user-agent-rewriter/background.js
@@ -3,12 +3,12 @@
 /*
 This is the page for which we want to rewrite the User-Agent header.
 */
-var targetPage = "https://httpbin.org/*";
+let targetPage = "https://httpbin.org/*";

 /*
 Map browser names to UA strings.
 */
-var uaStrings = {
+let uaStrings = {
  "Firefox 41": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:41.0) Gecko/20100101 Firefox/41.0",
  "Chrome 41": "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2228.0 Safari/537.36",
  "IE 11": "Mozilla/5.0 (compatible, MSIE 11, Windows NT 6.3; Trident/7.0;  rv:11.0) like Gecko"
@@ -17,13 +17,13 @@ var uaStrings = {
 /*
 Initialize the UA to Firefox 41.
 */
-var ua = uaStrings["Firefox 41"];
+let ua = uaStrings["Firefox 41"];

 /*
 Rewrite the User-Agent header to "ua".
 */
 function rewriteUserAgentHeader(e) {
-  for (var header of e.requestHeaders) {
+  for (let header of e.requestHeaders) {
    if (header.name.toLowerCase() === "user-agent") {
      header.value = ua;
    }
--- a/user-agent-rewriter/popup/choose_ua.js
+++ b/user-agent-rewriter/popup/choose_ua.js
@@ -9,7 +9,7 @@ document.addEventListener("click", (e) => {
    return;
  }

-  var chosenUa = e.target.textContent;
-  var backgroundPage = browser.extension.getBackgroundPage();
+  let chosenUa = e.target.textContent;
+  let backgroundPage = browser.extension.getBackgroundPage();
  backgroundPage.setUaString(chosenUa);
 });
--- a/webpack-modules/popup/left-pad.js
+++ b/webpack-modules/popup/left-pad.js
@@ -13,7 +13,7 @@ document.getElementById("leftpad-form").addEventListener("submit", (e) => {
 }, false);

 document.getElementById("pad-bg").addEventListener("click", (e) => {
-    var sendingMessage = browser.runtime.sendMessage({
+    let sendingMessage = browser.runtime.sendMessage({
        text: textNode.value,
        amount: amountNode.valueAsNumber,
        with: withNode.value
--- a/window-manipulator/window.js
+++ b/window-manipulator/window.js
@@ -6,7 +6,7 @@ document.addEventListener("click", (e) => {

  if (e.target.id === "window-update-size_768") {
    getCurrentWindow().then((currentWindow) => {
-      var updateInfo = {
+      let updateInfo = {
        width: 768,
        height: 1024
      };
@@ -17,7 +17,7 @@ document.addEventListener("click", (e) => {

  if (e.target.id === "window-update-minimize") {
    getCurrentWindow().then((currentWindow) => {
-      var updateInfo = {
+      let updateInfo = {
        state: "minimized"
      };

@@ -80,13 +80,13 @@ document.addEventListener("click", (e) => {
  }

  else if (e.target.id === "window-resize-all") {
-    var gettingAll = browser.windows.getAll();
+    let gettingAll = browser.windows.getAll();
    gettingAll.then((windows) => {
-      var updateInfo = {
+      let updateInfo = {
        width: 1024,
        height: 768
      };
-      for (var item of windows) {
+      for (let item of windows) {
        browser.windows.update(item.id, updateInfo);
      }
    });