feat(sendHtml/legacy): only check user agent for ie (#147)

americanexpress · May 21, 2020 · cc0aa95 · cc0aa95
1 parent 1066553
commit cc0aa95
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 46 deletions.
diff --git a/__tests__/server/middleware/sendHtml.spec.js b/__tests__/server/middleware/sendHtml.spec.js
@@ -253,7 +253,8 @@ describe('sendHtml', () => {
     });
 
     it('sends a rendered page with the __holocron_module_bundle_type__ global set according to the user agent and the client module map that only includes the relevant details', () => {
-      req.headers['user-agent'] = 'Browser/5.0 (compatible; NUEI 100.0; Doors TX 81.4; Layers/1.0)';
+      // MSIE indicates legacy IE
+      req.headers['user-agent'] = 'Browser/5.0 (compatible; MSIE 100.0; Doors TX 81.4; Layers/1.0)';
       sendHtml(req, res);
       expect(res.send).toHaveBeenCalledTimes(1);
       expect(res.send.mock.calls[0][0]).toContain('<!DOCTYPE html>');
@@ -319,7 +320,8 @@ describe('sendHtml', () => {
     });
 
     it('sends a rendered page with the legacy app bundle according to the user agent', () => {
-      req.headers['user-agent'] = 'Browser/5.0 (compatible; NUEI 100.0; Doors TX 81.4; Layers/1.0)';
+      // rv:11 indicates IE 11  on mobile
+      req.headers['user-agent'] = 'Browser/5.0 (compatible; NUEI 100.0; Doors TX 81.4; rv:11)';
       sendHtml(req, res);
       expect(res.send).toHaveBeenCalledTimes(1);
       expect(res.send.mock.calls[0][0]).toContain('<script src="/cdnUrl/app/1.2.3-rc.4-abc123/legacy/bundle~common.js" integrity="abc" crossorigin="anonymous"></script>');

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -79,9 +79,7 @@
     "@americanexpress/one-app-ducks": "^4.0.1",
     "@americanexpress/one-app-router": "^1.1.0",
     "@americanexpress/vitruvius": "^2.0.0",
-    "babel-preset-amex": "^3.2.0",
     "body-parser": "^1.19.0",
-    "browserslist-useragent": "^3.0.2",
     "chalk": "^3.0.0",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.4",
@@ -129,6 +127,7 @@
     "@babel/core": "^7.7.2",
     "@babel/node": "^7.7.0",
     "@babel/register": "^7.7.0",
+    "babel-preset-amex": "^3.2.0",
     "@commitlint/cli": "^8.2.0",
     "@commitlint/config-conventional": "^8.2.0",
     "@rollup/plugin-node-resolve": "^7.1.1",

diff --git a/src/server/middleware/sendHtml.js b/src/server/middleware/sendHtml.js
@@ -16,8 +16,6 @@
 
 // This rule is only needed for a couple functions below
 /* eslint-disable es/no-arrow-functions */
-import { matchesUA } from 'browserslist-useragent';
-import { browserList } from 'babel-preset-amex/browserlist';
 import { Set as iSet, Map as iMap } from 'immutable';
 
 import transit from '../../universal/utils/transit';
@@ -33,6 +31,16 @@ const { buildVersion } = readJsonFile('../../../.build-meta.json');
 const integrityManifest = readJsonFile('../../../bundle.integrity.manifest.json');
 const nodeEnvIsDevelopment = process.env.NODE_ENV === 'development';
 
+// http://www.useragentstring.com/pages/useragentstring.php?name=Internet+Explorer
+const legacyIndicators = [
+  'rv:11', // IE 11 on mobile
+  'MSIE', // IE
+];
+
+const legacyUserAgent = (userAgent) => (
+  legacyIndicators.some((legacyIndicator) => userAgent.includes(legacyIndicator))
+);
+
 function getChunkAssets(assetsByChunkName) {
   return Object
     .entries(assetsByChunkName)
@@ -278,10 +286,7 @@ export default function sendHtml(req, res) {
     } = req;
     const { scriptNonce } = res;
     const userAgent = headers['user-agent'];
-    const isLegacy = !matchesUA(userAgent, {
-      browsers: browserList,
-      allowHigherVersions: true,
-    });
+    const isLegacy = legacyUserAgent(userAgent);
 
     console.info(`sendHtml, have store? ${!!store}, have appHtml? ${!!appHtml}`);
     if (appHtml && typeof appHtml !== 'string') {