Fetch API missing support handling (#578)

* Fixes vague errors thrown in older browsers such as IE10/11 and iOS mobile Safari related to worker support.
Most of these are attributed to lack of support for fetch related APIs even when web workers are still supported.
In that case we throw an operation not supported in environment error on operations that require http requests.

* Added yarn.lock auto changes.

Author: bojeil-google

packages/auth/demo/public/script.js

@@ -1146,9 +1146,11 @@ function populateActionCodes() {
 /**
  * Provides basic Database checks for authenticated and unauthenticated access.
  * The Database node being tested has the following rule:
- * "$user_id": {
- *   ".read": "$user_id === auth.uid",
- *   ".write": "$user_id === auth.uid"
+ * "users": {
+ *   "$user_id": {
+ *     ".read": "$user_id === auth.uid",
+ *     ".write": "$user_id === auth.uid"
+ *   }
  * }
  * This applies when Real-time database service is available.
  */
@@ -1226,7 +1228,7 @@ function onRunWebWorkTests() {
     return;
   }
   var onError = function(error) {
-    alertError('Error: ' + error.code);
+    alertError('Error code: ' + error.code + ' message: ' + error.message);
   };
   auth.signInWithPopup(new firebase.auth.GoogleAuthProvider())
       .then(function(result) {

packages/auth/demo/public/web-worker.js

@@ -23,6 +23,11 @@ importScripts('/dist/firebase-app.js');
 importScripts('/dist/firebase-auth.js');
 importScripts('config.js');
 
+// Polyfill Promise in case it is not supported.
+if (typeof Promise === 'undefined') {
+  var Promise = firebase.Promise;
+}
+
 // Initialize the Firebase app in the web worker.
 firebase.initializeApp(config);
 
@@ -179,7 +184,8 @@ self.onmessage = function(e) {
           self.postMessage(result);
         }).catch(function(error) {
           result.status = 'failure';
-          result.error = error;
+          // DataCloneError when postMessaging in IE11 and 10.
+          result.error = error.code ? error : error.message;
           self.postMessage(result);
         });
         break;

packages/auth/package.json

@@ -28,6 +28,7 @@
     "del": "^3.0.0",
     "express": "^4.16.2",
     "firebase-tools": "^3.17.4",
+    "firebase-functions": "^0.9.0",
     "google-closure-compiler": "^20180204.0.0",
     "google-closure-library": "^20180204.0.0",
     "gulp": "^3.9.1",

packages/auth/src/rpchandler.js

@@ -462,6 +462,13 @@ fireauth.RpcHandler.prototype.sendXhrUsingXhrIo_ = function(
     opt_data,
     opt_headers,
     opt_timeout) {
+  if (fireauth.util.isWorker() && !fireauth.util.isFetchSupported()) {
+    throw new fireauth.AuthError(
+        fireauth.authenum.Error.OPERATION_NOT_SUPPORTED,
+        'fetch, Headers and Request native APIs or equivalent Polyfills ' +
+        'must be available to support HTTP requests from a Worker ' +
+        'environment.');
+  }
   var xhrIo = new goog.net.XhrIo(this.rpcHandlerXhrFactory_);
 
   // xhrIo.setTimeoutInterval not working in IE10 and IE11, handle manually.

packages/auth/src/utils.js

@@ -629,6 +629,20 @@ fireauth.util.isWorker = function(opt_global) {
 };
 
 
+/**
+ * @param {?Object=} opt_global The optional global scope.
+ * @return {boolean} Whether current environment supports fetch API and other
+ *     APIs it depends on.
+ */
+fireauth.util.isFetchSupported = function(opt_global) {
+  // Required by fetch API calls.
+  var scope = opt_global || goog.global;
+  return typeof scope['fetch'] !== 'undefined' &&
+         typeof scope['Headers'] !== 'undefined' &&
+         typeof scope['Request'] !== 'undefined';
+};
+
+
 /**
  * Enum for the runtime environment.
  * @enum {string}

packages/auth/test/rpchandler_test.js

@@ -209,6 +209,11 @@ function testRpcHandler_XMLHttpRequest_worker() {
       fireauth.util,
       'isWorker',
       function() {return true;});
+  // Simulate fetch, Request and Headers API supported.
+  stubs.replace(
+      fireauth.util,
+      'isFetchSupported',
+      function() {return true;});
   // No XMLHttpRequest available.
   stubs.replace(
       fireauth.RpcHandler,
@@ -233,6 +238,42 @@ function testRpcHandler_XMLHttpRequest_worker() {
 }
 
 
+function testRpcHandler_XMLHttpRequest_worker_fetchNotSupported() {
+  // Test worker environment where fetch, Headers and Request are not supported.
+  // Simulates global self in a worker environment.
+  goog.global['self']  = {};
+  var expectedError = new fireauth.AuthError(
+      fireauth.authenum.Error.OPERATION_NOT_SUPPORTED,
+      'fetch, Headers and Request native APIs or equivalent Polyfills ' +
+      'must be available to support HTTP requests from a Worker environment.');
+  stubs.reset();
+  // Simulate worker environment.
+  stubs.replace(
+      fireauth.util,
+      'isWorker',
+      function() {return true;});
+  // Simulate fetch, Request and Headers API not supported.
+  stubs.replace(
+      fireauth.util,
+      'isFetchSupported',
+      function() {return false;});
+  // No XMLHttpRequest available.
+  stubs.replace(
+      fireauth.RpcHandler,
+      'getXMLHttpRequest',
+      function() {return undefined;});
+  asyncTestCase.waitForSignals(1);
+  rpcHandler = new fireauth.RpcHandler('apiKey');
+  // Simulate RPC and then expected error thrown.
+  rpcHandler.fetchProvidersForIdentifier('[email protected]')
+      .thenCatch(function(actualError) {
+        fireauth.common.testHelper.assertErrorEquals(
+            expectedError, actualError);
+        asyncTestCase.signal();
+      });
+}
+
+
 function testRpcHandler_XMLHttpRequest_corsBrowser() {
   // Test CORS browser environment that CorsXmlHttpFactory is used in
   // initialization of goog.net.XhrIo.

packages/auth/test/utils_test.js

@@ -520,6 +520,31 @@ function testIsWorker() {
 }
 
 
+function testIsFetchSupported() {
+  // All fetch related APIs supported.
+  assertTrue(fireauth.util.isFetchSupported({
+    'fetch': function() {},
+    'Request': function() {},
+    'Headers': function() {}
+  }));
+  // Headers missing.
+  assertFalse(fireauth.util.isFetchSupported({
+    'fetch': function() {},
+    'Request': function() {},
+  }));
+  // Request missing.
+  assertFalse(fireauth.util.isFetchSupported({
+    'fetch': function() {},
+    'Headers': function() {}
+  }));
+  // fetch missing.
+  assertFalse(fireauth.util.isFetchSupported({
+    'Request': function() {},
+    'Headers': function() {}
+  }));
+}
+
+
 function testGetBrowserName_opera() {
   assertEquals('Opera', fireauth.util.getBrowserName(operaUA));
 }