updating tools articles to use const/let

navateja-alagam · Nov 23, 2019 · 7c60d31 · 7c60d31
1 parent 76596d1
commit 7c60d31
Show file tree

Hide file tree

Showing 25 changed files with 108 additions and 109 deletions.
diff --git a/tools-testing/cross-browser-testing/accessibility/fake-div-buttons.html b/tools-testing/cross-browser-testing/accessibility/fake-div-buttons.html
@@ -33,15 +33,15 @@ <h2>Fake buttons</h2>
     <div data-message="This is from the third button" tabindex="0">And me!</div>
 
     <script>
-      var buttons = document.querySelectorAll('div');
+      const buttons = document.querySelectorAll('div');
 
-      for(var i = 0; i < buttons.length; i++) {
+      for(let i = 0; i < buttons.length; i++) {
         addHandler(buttons[i]);
       }
 
       function addHandler(button) {
         button.onclick = function(e) {
-          var message = e.target.getAttribute('data-message');
+          let message = e.target.getAttribute('data-message');
           alert(message);
         }
       }

diff --git a/tools-testing/cross-browser-testing/accessibility/native-keyboard-accessibility.html b/tools-testing/cross-browser-testing/accessibility/native-keyboard-accessibility.html
@@ -57,15 +57,15 @@ <h2>Form</h2>
     </form>
 
     <script>
-      var buttons = document.querySelectorAll('button');
+      const buttons = document.querySelectorAll('button');
 
-      for(var i = 0; i < buttons.length; i++) {
+      for(let i = 0; i < buttons.length; i++) {
         addHandler(buttons[i]);
       }
 
       function addHandler(button) {
         button.addEventListener('click', function(e) {
-          var message = e.target.getAttribute('data-message');
+          let message = e.target.getAttribute('data-message');
           alert(message);
         })
       }

diff --git a/tools-testing/cross-browser-testing/automation/call_bstack.js b/tools-testing/cross-browser-testing/automation/call_bstack.js
@@ -1,8 +1,8 @@
-var request = require("request");
+const request = require("request");
 
-var bsUser = "BROWSERSTACK_USERNAME";
-var bsKey = "BROWSERSTACK_ACCESS_KEY";
-var baseUrl = "https://" + bsUser + ":" + bsKey + "@www.browserstack.com/automate/";
+let bsUser = "BROWSERSTACK_USERNAME";
+let bsKey = "BROWSERSTACK_ACCESS_KEY";
+let baseUrl = "https://" + bsUser + ":" + bsKey + "@www.browserstack.com/automate/";
 
 function getPlanDetails(){
 	request({uri: baseUrl + "plan.json"}, function(err, res, body){

diff --git a/tools-testing/cross-browser-testing/automation/call_sauce.js b/tools-testing/cross-browser-testing/automation/call_sauce.js
@@ -1,6 +1,6 @@
-var SauceLabs = require('saucelabs');
+const SauceLabs = require('saucelabs');
 
-var myAccount = new SauceLabs({
+let myAccount = new SauceLabs({
   username: "your-sauce-username",
   password: "your-sauce-api-key"
 });
@@ -12,10 +12,10 @@ myAccount.getAccountDetails(function (err, res) {
     console.log(res);
     myAccount.getJobs(function (err, jobs) {
       // Get a list of all your jobs
-      for (var k in jobs) {
+      for (let k in jobs) {
         if ( jobs.hasOwnProperty( k )) {
           myAccount.showJob(jobs[k].id, function (err, res) {
-            var str = res.id + ": Status: " + res.status;
+            let str = res.id + ": Status: " + res.status;
             if (res.error) {
               str += "\033[31m Error: " + res.error + " \033[0m";
             }

diff --git a/tools-testing/cross-browser-testing/automation/gulpfile.js b/tools-testing/cross-browser-testing/automation/gulpfile.js
@@ -1,9 +1,9 @@
-var gulp = require('gulp');
-var htmltidy = require('gulp-htmltidy');
-var autoprefixer = require('gulp-autoprefixer');
-var csslint = require('gulp-csslint');
-var babel = require('gulp-babel');
-var jshint = require('gulp-jshint');
+const gulp = require('gulp');
+const htmltidy = require('gulp-htmltidy');
+const autoprefixer = require('gulp-autoprefixer');
+const csslint = require('gulp-csslint');
+const babel = require('gulp-babel');
+const jshint = require('gulp-jshint');
 
 gulp.task('default', ['html', 'css', 'js']);
 

diff --git a/tools-testing/cross-browser-testing/automation/index.html b/tools-testing/cross-browser-testing/automation/index.html
@@ -7,7 +7,6 @@
   </head>
 
   <body>
-    <p></p>
     <script src="main.js"></script>
   </body>
 </html>
diff --git a/tools-testing/cross-browser-testing/automation/main.js b/tools-testing/cross-browser-testing/automation/main.js
@@ -1,8 +1,8 @@
-var array = ['Chris', 'Bob', 'Mark', 'Paul'];
+let array = ['Chris', 'Bob', 'Mark', 'Paul'];
 
 // Arrow function syntax
 array.forEach((e, i, a) => {
-   var elem = document.createElement('p');
+   const elem = document.createElement('p');
    elem.textContent = (i + 1) + '. ' + e;
    document.body.appendChild(elem);
 });
diff --git a/tools-testing/cross-browser-testing/feature-detection/css-feature-detect-finished.html b/tools-testing/cross-browser-testing/feature-detection/css-feature-detect-finished.html
@@ -53,8 +53,8 @@ <h1>My funky website</h1>
 
     <script>
 
-      var conditional = document.querySelector('.conditional');
-      var testElem = document.createElement('div');
+      const conditional = document.querySelector('.conditional');
+      const testElem = document.createElement('div');
       if(testElem.style.flex !== undefined && testElem.style.flexFlow !== undefined) {
         conditional.setAttribute('href', 'flex-layout.css');
       } else {

diff --git a/tools-testing/cross-browser-testing/javascript/arrow-function.html b/tools-testing/cross-browser-testing/javascript/arrow-function.html
@@ -9,7 +9,7 @@
 
   <body>
     <script>
-      var array = ['Chris', 'Bob', 'Mark', 'Paul'];
+      let array = ['Chris', 'Bob', 'Mark', 'Paul'];
 
       // Old style syntax
       //
@@ -21,7 +21,7 @@
 
       // Arrow function syntax
       array.forEach((e, i, a) => {
-         var elem = document.createElement('p');
+         const elem = document.createElement('p');
          elem.textContent = (i + 1) + '. ' + e;
          document.body.appendChild(elem);
       });

diff --git a/tools-testing/cross-browser-testing/javascript/bad-for-loop.html b/tools-testing/cross-browser-testing/javascript/bad-for-loop.html
@@ -6,8 +6,8 @@
   </head>
   <body>
     <script>
-      for(var i = 1; i <= 10; i++) {
-        var para = document.createElement('p');
+      for(let i = 1; i <= 10; i++) {
+        const para = document.createElement('p');
         para.textContent = 'This is paragraph ' + i + '.';
         document.body.appendChild(para);
         para.onclick = function() {

diff --git a/tools-testing/cross-browser-testing/javascript/broken-ajax.html b/tools-testing/cross-browser-testing/javascript/broken-ajax.html
@@ -20,48 +20,48 @@
       </section>
 
     <script>
-    var header = document.querySelector('header');
-    var section = document.querySelector('section');
+    const header = document.querySelector('header');
+    const section = document.querySelector('section');
 
-    var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
-    var request = new XMLHttpRequest();
+    let requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
+    let request = new XMLHttpRequest();
     request.open('GET', requestURL);
     request.send();
 
-    var superHeroes = request.response;
+    let superHeroes = request.response;
     populateHeader(superHeroes);
     showHeroes(superHeroes);
 
     function populateHeader(jsonObj) {
-      var myH1 = document.createElement('h1');
+      const myH1 = document.createElement('h1');
       myH1.textContent = jsonObj['squadName'];
       header.appendChild(myH1);
 
-      var myPara = document.createElement('p');
+      const myPara = document.createElement('p');
       myPara.textContent = 'Hometown: ' + jsonObj['homeTown'] + ' // Formed: ' + jsonObj['formed'];
       header.appendChild(myPara);
 
     }
 
     function showHeroes(jsonObj) {
-      var heroes = jsonObj['members'];
+      let heroes = jsonObj['members'];
 
       for(i = 0; i < heroes.length; i++) {
-        var myArticle = document.createElement('article');
-        var myH2 = document.createElement('h2');
-        var myPara1 = document.createElement('p');
-        var myPara2 = document.createElement('p');
-        var myPara3 = document.createElement('p');
-        var myList = document.createElement('ul');
+        const myArticle = document.createElement('article');
+        const myH2 = document.createElement('h2');
+        const myPara1 = document.createElement('p');
+        const myPara2 = document.createElement('p');
+        const myPara3 = document.createElement('p');
+        const myList = document.createElement('ul');
 
         myH2.textContent = heroes[i].name;
         myPara1.textContent = 'Secret identity: ' + heroes[i].secretIdentity;
         myPara2.textContent = 'Age: ' + heroes[i].age;
         myPara3.textContent = 'Superpowers:';
 
-        var superPowers = heroes[i].powers;
-        for(j = 0; j < superPowers.length; j++) {
-          var listItem = document.createElement('li');
+        let superPowers = heroes[i].powers;
+        for(let j = 0; j < superPowers.length; j++) {
+          const listItem = document.createElement('li');
           listItem.textContent = superPowers[j];
           myList.appendChild(listItem);
         }

diff --git a/tools-testing/cross-browser-testing/javascript/broken-js-test.js b/tools-testing/cross-browser-testing/javascript/broken-js-test.js
@@ -1,5 +1,5 @@
-for(var i = 1; i <= 10; i++) {
-  var para = document.createElement('p');
+for(let i = 1; i <= 10; i++) {
+  const para = document.createElement('p');
   para.textContent = 'This is paragraph ' + i + '.';
   document.body.appendChild(para);
   addHandler(para, i);

diff --git a/tools-testing/cross-browser-testing/javascript/fetch-polyfill-finished.html b/tools-testing/cross-browser-testing/javascript/fetch-polyfill-finished.html
@@ -21,11 +21,11 @@ <h1>Fetch basic example</h1>
     <script src="es6-promise.js"></script>
     <script src="fetch.js"></script>
     <script>
-      var myImage = document.querySelector('.my-image');
+      const myImage = document.querySelector('.my-image');
 
       fetch('flowers.jpg').then(function(response) {
         response.blob().then(function(myBlob) {
-          var objectURL = URL.createObjectURL(myBlob);
+          let objectURL = URL.createObjectURL(myBlob);
           myImage.src = objectURL;
         });
       });

diff --git a/tools-testing/cross-browser-testing/javascript/fetch-polyfill-only-when-needed.html b/tools-testing/cross-browser-testing/javascript/fetch-polyfill-only-when-needed.html
@@ -26,11 +26,11 @@ <h1>Fetch basic example</h1>
       }
 
       function main(err) {
-        var myImage = document.querySelector('.my-image');
+        const myImage = document.querySelector('.my-image');
 
         fetch('flowers.jpg').then(function(response) {
           response.blob().then(function(myBlob) {
-            var objectURL = URL.createObjectURL(myBlob);
+            let objectURL = URL.createObjectURL(myBlob);
             myImage.src = objectURL;
           });
         });
@@ -41,7 +41,7 @@ <h1>Fetch basic example</h1>
       }
 
       function loadScript(src, done) {
-        var js = document.createElement('script');
+        const js = document.createElement('script');
         js.src = src;
         js.onload = function() {
           done();

diff --git a/tools-testing/cross-browser-testing/javascript/fixed-ajax.html b/tools-testing/cross-browser-testing/javascript/fixed-ajax.html
@@ -20,51 +20,51 @@
       </section>
 
     <script>
-    var header = document.querySelector('header');
-    var section = document.querySelector('section');
+    const header = document.querySelector('header');
+    const section = document.querySelector('section');
 
-    var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
-    var request = new XMLHttpRequest();
+    let requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
+    let request = new XMLHttpRequest();
     request.open('GET', requestURL);
     request.responseType = 'json';
     request.send();
 
     request.onload = function() {
-      var superHeroes = request.response;
+      let superHeroes = request.response;
       populateHeader(superHeroes);
       showHeroes(superHeroes);
     }
 
     function populateHeader(jsonObj) {
-      var myH1 = document.createElement('h1');
+      const myH1 = document.createElement('h1');
       myH1.textContent = jsonObj['squadName'];
       header.appendChild(myH1);
 
-      var myPara = document.createElement('p');
+      const myPara = document.createElement('p');
       myPara.textContent = 'Hometown: ' + jsonObj['homeTown'] + ' // Formed: ' + jsonObj['formed'];
       header.appendChild(myPara);
 
     }
 
     function showHeroes(jsonObj) {
-      var heroes = jsonObj['members'];
+      const heroes = jsonObj['members'];
 
-      for(i = 0; i < heroes.length; i++) {
-        var myArticle = document.createElement('article');
-        var myH2 = document.createElement('h2');
-        var myPara1 = document.createElement('p');
-        var myPara2 = document.createElement('p');
-        var myPara3 = document.createElement('p');
-        var myList = document.createElement('ul');
+      for(let i = 0; i < heroes.length; i++) {
+        const myArticle = document.createElement('article');
+        const myH2 = document.createElement('h2');
+        const myPara1 = document.createElement('p');
+        const myPara2 = document.createElement('p');
+        const myPara3 = document.createElement('p');
+        const myList = document.createElement('ul');
 
         myH2.textContent = heroes[i].name;
         myPara1.textContent = 'Secret identity: ' + heroes[i].secretIdentity;
         myPara2.textContent = 'Age: ' + heroes[i].age;
         myPara3.textContent = 'Superpowers:';
 
-        var superPowers = heroes[i].powers;
-        for(j = 0; j < superPowers.length; j++) {
-          var listItem = document.createElement('li');
+        let superPowers = heroes[i].powers;
+        for(let j = 0; j < superPowers.length; j++) {
+          const listItem = document.createElement('li');
           listItem.textContent = superPowers[j];
           myList.appendChild(listItem);
         }

diff --git a/tools-testing/cross-browser-testing/javascript/good-for-loop.html b/tools-testing/cross-browser-testing/javascript/good-for-loop.html
@@ -6,8 +6,8 @@
   </head>
   <body>
     <script>
-      for(var i = 1; i <= 10; i++) {
-        var para = document.createElement('p');
+      for(let i = 1; i <= 10; i++) {
+        const para = document.createElement('p');
         para.textContent = 'This is paragraph ' + i + '.';
         document.body.appendChild(para);
         addHandler(para, i);

diff --git a/tools-testing/cross-browser-testing/javascript/polyfills.js b/tools-testing/cross-browser-testing/javascript/polyfills.js
@@ -20,7 +20,7 @@ function isFunction(x) {
   return typeof x === 'function';
 }
 
-var _isArray = undefined;
+let _isArray = undefined;
 if (!Array.isArray) {
   _isArray = function (x) {
     return Object.prototype.toString.call(x) === '[object Array]';
@@ -29,13 +29,13 @@ if (!Array.isArray) {
   _isArray = Array.isArray;
 }
 
-var isArray = _isArray;
+let isArray = _isArray;
 
-var len = 0;
-var vertxNext = undefined;
-var customSchedulerFn = undefined;
+let len = 0;
+let vertxNext = undefined;
+let customSchedulerFn = undefined;
 
-var asap = function asap(callback, arg) {
+let asap = function asap(callback, arg) {
   queue[len] = callback;
   queue[len + 1] = arg;
   len += 2;
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,7 +7,6 @@ @@
       </head>
       <body>
-        <p></p>
         <script src="main.js"></script>
       </body>
     </html>