Load javascript asyncronously (#1988)

google · Apr 6, 2021 · f450777 · f450777
1 parent dc17047
commit f450777
Show file tree

Hide file tree

Showing 33 changed files with 154 additions and 152 deletions.
diff --git a/assets/server/admin/sms/show.html b/assets/server/admin/sms/show.html
@@ -95,8 +95,8 @@ <h1>System SMS config</h1>
     </div>
   </main>
 
-  <script type="text/javascript">
-    $(function() {
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       let $container = $('#twilio-from-numbers-container');
       let $template = $('#twilio-from-number-template');
       let counter = 0;

diff --git a/assets/server/apikeys/show.html b/assets/server/apikeys/show.html
@@ -125,7 +125,7 @@ <h5 class="modal-title">Statistics for {{$authApp.Name}}</h5>
     </div>
   </main>
 
-  <script type="text/javascript">
+  <script defer type="text/javascript">
     var chartData = [];
     $(() => redrawCharts(chartData, 300));
 

diff --git a/assets/server/codes/bulk-issue.html b/assets/server/codes/bulk-issue.html
@@ -168,7 +168,7 @@
     </div>
   </main>
 
-  <script type="text/javascript">
+  <script defer type="text/javascript">
     let total = 0;
     let totalErrs = 0;
 
@@ -205,7 +205,7 @@
     let tzOffset = new Date().getTimezoneOffset();
     let csrfToken = {{.csrfToken}};
 
-    $(function() {
+    window.addEventListener('load', (event) => {
       initBulkUploadUI();
 
       let randomString = getCookie("retryCode");

diff --git a/assets/server/codes/index.html b/assets/server/codes/index.html
@@ -62,8 +62,8 @@ <h1>Verification code status</h1>
     </div>
   </main>
 
-  <script type="text/javascript">
-    $(function() {
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       let $form = $('#form-check-status');
       let $uuid = $('#uuid');
 

diff --git a/assets/server/codes/issue.html b/assets/server/codes/issue.html
@@ -245,7 +245,7 @@ <h1>{{t $.locale "codes.issue.header"}}</h1>
     </div>
   </main>
 
-  <script type="text/javascript">
+  <script defer type="text/javascript">
     let $form;
       let $inputTestDate;
       let $inputSymptomDate;
@@ -268,7 +268,7 @@ <h1>{{t $.locale "codes.issue.header"}}</h1>
     let codeCountdown;
     let longCodeCountdown;
 
-    $(function() {
+    window.addEventListener('load', (event) => {
       $form = $('form#issue');
         $inputTestDate = $('input#test-date');
         $inputSymptomDate = $('input#symptom-date');

diff --git a/assets/server/codes/show.html b/assets/server/codes/show.html
@@ -73,12 +73,12 @@ <h5 class="mb-1">SMS link expiry</h5>
   </main>
 
   {{if not .code.Claimed}}
-  <script type="text/javascript">
+  <script defer type="text/javascript">
     let $buttonInvalidate = $('button#invalidate');
     let expires = {{ .code.Expires }};
     let longExpires = {{ .code.LongExpires }};
 
-    $(function() {
+    window.addEventListener('load', (event) => {
       let $codeExpiresAt = $('#code-expires-at');
       countdown($codeExpiresAt, expires);
 

diff --git a/assets/server/firebase.html b/assets/server/firebase.html
@@ -3,7 +3,7 @@
 <script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-app.js"></script>
 <script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-auth.js"></script>
 
-<script type="text/javascript">
+<script defer type="text/javascript">
   var firebaseConfig = {
     apiKey: "{{.firebase.APIKey}}",
     projectId: "{{.firebase.ProjectID}}",

diff --git a/assets/server/header.html b/assets/server/header.html
@@ -25,15 +25,15 @@
 <link rel="stylesheet"
   href="/static/css/application.css" crossorigin="anonymous" />
 
-<script src="https://code.jquery.com/jquery-3.5.1.min.js"
+<script defer src="https://code.jquery.com/jquery-3.5.1.min.js"
   integrity="sha384-ZvpUoO/+PpLXR1lu4jmpXWu80pZlYUAfxl5NsBMWOEPSjUn/6Z/hRTt8+pR6L4N2" crossorigin="anonymous"></script>
-<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
+<script defer src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
   integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js"
+<script defer src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js"
   integrity="sha384-+YQ4JLhjyBLPDQt//I+STsc9iw4uQqACwlvpslubQzn4u2UU2UFM80nGisd026JF" crossorigin="anonymous"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.12/js/intlTelInput.js"
+<script defer src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.12/js/intlTelInput.js"
   integrity="sha384-qqHEed+7J6B7s1PDZUg0ockDBmE8DsXphZqsNwV2pzkH5kXcNP7ZKRYLxbd5f/WL" crossorigin="anonymous"></script>
-<script src="/static/js/application.js?{{.buildID}}" crossorigin="anonymous"></script>
+<script defer src="/static/js/application.js?{{.buildID}}" crossorigin="anonymous"></script>
 
 <title>{{if .title}}{{.title}}{{else}}Exposure Notifications Verification Server{{end}}</title>
 {{end}}

diff --git a/assets/server/login/_loginscripts.html b/assets/server/login/_loginscripts.html
@@ -1,40 +1,42 @@
 {{define "loginscripts"}}
-<script type="text/javascript">
-  firebase.auth().onAuthStateChanged(function(user) {
-    if (!user) {
-      return
+<script defer type="text/javascript">
+  window.addEventListener('load', (event) => {
+    firebase.auth().onAuthStateChanged(function(user) {
+      if (!user) {
+        return
+      }
+      setSession(user)
+    });
+
+    function setSession(user) {
+      user.getIdToken().then(idToken => {
+        $.ajax({
+          type: 'POST',
+          url: '/session',
+          data: {
+            idToken: idToken,
+          },
+          headers: { 'X-CSRF-Token': getCSRFToken() },
+          contentType: 'application/x-www-form-urlencoded',
+          {{if not .currentUser}}
+          success: function(returnData) {
+            // The user successfully signed in, redirect to realm selection.
+            window.location.assign('/login/select-realm');
+          },
+          {{end}}
+          error: function(xhr, status, e) {
+            // There was an error finding the user. Redirect to the
+            // sign-out page to clear the firebase cookie and any session
+            // data.
+            //
+            // The flash data may have more detailed error messages, which
+            // will be displayed on the signout page.
+            window.location.assign("/signout");
+          }
+        })
+      });
     }
-    setSession(user)
   });
-
-  function setSession(user) {
-    user.getIdToken().then(idToken => {
-      $.ajax({
-        type: 'POST',
-        url: '/session',
-        data: {
-          idToken: idToken,
-        },
-        headers: { 'X-CSRF-Token': getCSRFToken() },
-        contentType: 'application/x-www-form-urlencoded',
-        {{if not .currentUser}}
-        success: function(returnData) {
-          // The user successfully signed in, redirect to realm selection.
-          window.location.assign('/login/select-realm');
-        },
-        {{end}}
-        error: function(xhr, status, e) {
-          // There was an error finding the user. Redirect to the
-          // sign-out page to clear the firebase cookie and any session
-          // data.
-          //
-          // The flash data may have more detailed error messages, which
-          // will be displayed on the signout page.
-          window.location.assign("/signout");
-        }
-      })
-    });
-  }
 </script>
 {{end}}
 

diff --git a/assets/server/login/change-password.html b/assets/server/login/change-password.html
@@ -55,8 +55,8 @@
 
 {{template "loginscripts" .}}
 
-<script type="text/javascript">
-    $(function() {
+<script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       {{template "login/requirements" .}}
 
       let $form = $('#password-form');

diff --git a/assets/server/login/login.html b/assets/server/login/login.html
@@ -67,8 +67,8 @@
 
   {{template "loginscripts" .}}
 
-  <script type="text/javascript">
-    $(function() {
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       let fn = function loginSuccess() {
         {{if .loginRedirect}}
           window.location.assign('{{.loginRedirect}}');

diff --git a/assets/server/login/register-phone.html b/assets/server/login/register-phone.html
@@ -78,8 +78,8 @@
     </div>
   </main>
 
-  <script type="text/javascript">
-    $(function() {
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       let $registerDiv = $('#register-div');
       let $displayName = $('#display');
       let $submit = $('#submit-register');

diff --git a/assets/server/login/select-password.html b/assets/server/login/select-password.html
@@ -57,8 +57,8 @@
     </div>
   </main>
 
-  <script type="text/javascript">
-    $(function() {
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
       {{template "login/requirements" .}}
       let $form = $('#loginForm');
       let $submit = $('#submit');

diff --git a/assets/server/login/signout.html b/assets/server/login/signout.html
@@ -17,7 +17,7 @@
     </div>
   </main>
 
-  <script type="text/javascript">
+  <script defer type="text/javascript">
     window.addEventListener('load', function() {
       firebase.auth().signOut().then(function() {
         $('#signout').text("Redirecting to login...")

diff --git a/assets/server/login/verify-email-check.html b/assets/server/login/verify-email-check.html
@@ -29,35 +29,35 @@
     </div>
   </main>
 
-  <script type="text/javascript">
-  $(function() {
-    let urlVars = getUrlVars();
-    let code = urlVars["oobCode"];
-    if (!code) {
-      code = "";
+  <script defer type="text/javascript">
+    window.addEventListener('load', (event) => {
+      let urlVars = getUrlVars();
+      let code = urlVars["oobCode"];
+      if (!code) {
+        code = "";
+      }
+
+      firebase.auth().applyActionCode(code)
+        .then(function(resp) {
+          window.location.assign("/");
+        }).catch(function(error) {
+          flash.clear();
+          flash.error("Invalid email verification code. "
+            + "The code may be malformed, expired, or has already been used.");
+        });
+    });
+
+    function getUrlVars() {
+      let vars = [], hash;
+      let queryParams = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
+      for (let i = 0; i < queryParams.length; i++) {
+        v = queryParams[i].split('=');
+        vars.push(v[0]);
+        vars[v[0]] = v[1];
+      }
+      return vars;
     }
-
-    firebase.auth().applyActionCode(code)
-      .then(function(resp) {
-        window.location.assign("/");
-      }).catch(function(error) {
-        flash.clear();
-        flash.error("Invalid email verification code. "
-          + "The code may be malformed, expired, or has already been used.");
-      });
-  });
-
-  function getUrlVars() {
-    let vars = [], hash;
-    let queryParams = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
-    for (let i = 0; i < queryParams.length; i++) {
-      v = queryParams[i].split('=');
-      vars.push(v[0]);
-      vars[v[0]] = v[1];
-    }
-    return vars;
-  }
-</script>
+  </script>
 </body>
 </html>
 {{end}}
diff --git a/assets/server/mobileapps/_app.html b/assets/server/mobileapps/_app.html
@@ -90,8 +90,8 @@
   </small>
 </div>
 
-<script type="text/javascript">
-  $(function() {
+<script defer type="text/javascript">
+  window.addEventListener('load', (event) => {
     let $selectOS = $('select#os');
     let $appIDGroup = $('#app-id-group');
     let $appIDInput = $('#app-id');

diff --git a/assets/server/realmadmin/_form_abuse_prevention.html b/assets/server/realmadmin/_form_abuse_prevention.html
@@ -97,8 +97,8 @@
   </div>
 </form>
 
-<script type="text/javascript">
-  $(function() {
+<script defer type="text/javascript">
+  window.addEventListener('load', (event) => {
     let $abusePreventionLimit = $('#abuse-prevention-limit');
     let $abusePreventionLimitFactor = $('#abuse-prevention-limit-factor');
     let $abusePreventionEffectiveLimit = $('#abuse-prevention-effective-limit');

diff --git a/assets/server/realmadmin/_form_security.html b/assets/server/realmadmin/_form_security.html
@@ -140,8 +140,8 @@
   </div>
 </form>
 
-<script type="text/javascript">
-  $(function(){
+<script defer type="text/javascript">
+  window.addEventListener('load', (event) => {
     let $grace = $('#mfa-grace-period');
     let $graceDiv = $('#grace-div');
     let $mfaMode = $('#mfa-mode');
@@ -156,6 +156,6 @@
       }
     });
   });
-  </script>
+</script>
 
 {{end}}
diff --git a/assets/server/realmadmin/_form_sms.html b/assets/server/realmadmin/_form_sms.html
@@ -289,7 +289,7 @@
   </div>
 </form>
 
-<script type="text/javascript">
+<script defer type="text/javascript">
   function removeTemplate(name) {
     $('#sms-template-0').trigger("click");
     $('#'+name).remove();
@@ -299,7 +299,7 @@
   //
   // SMS preview builder
   //
-  $(function() {
+  window.addEventListener('load', (event) => {
     function randShortCode(length) {
       const chars = '0123456789';