Merge pull request #279 from mozilla/split

create separate js bundles for upload/download pages
2017-07-21 16:55:50 -07:00 · 2017-07-21 16:55:50 -07:00 · 5ed4db9689
parent 7243a10340 31b810eb7d
commit 5ed4db9689
13 changed files with 252 additions and 1058 deletions
--- a/.eslintignore
+++ b/.eslintignore
@ -1,4 +1,5 @@
-public/bundle.js
+public/upload.js
+public/download.js
 public/webcrypto-shim.js
 test/frontend/bundle.js
 firefox
--- a/.gitignore
+++ b/.gitignore
@ -1,6 +1,7 @@
 .DS_Store
 node_modules
-public/bundle.js
+public/upload.js
+public/download.js
 public/version.json
 static/*
 !static/info.txt
--- a/circle.yml
+++ b/circle.yml
@ -16,7 +16,7 @@ deployment:
  latest:
    branch: master
    commands:
-    - npm run predocker
+    - npm run build
    - docker login -e $DOCKER_EMAIL -u $DOCKER_USER -p $DOCKER_PASS
    - docker build -t mozilla/send:latest .
    - docker push mozilla/send:latest
@ -24,7 +24,7 @@ deployment:
    tag: /.*/
    owner: mozilla
    commands:
-    - npm run predocker
+    - npm run build
    - docker login -e $DOCKER_EMAIL -u $DOCKER_USER -p $DOCKER_PASS
    - docker build -t mozilla/send:$CIRCLE_TAG .
    - docker push mozilla/send:$CIRCLE_TAG
--- a/frontend/src/common.js
+++ b/frontend/src/common.js
@ -8,6 +8,3 @@ window.analytics = new testPilotGA({
  ds: 'web',
  tid: window.trackerId
 })
-
-require('./upload');
-require('./download');
--- a/frontend/src/download.js
+++ b/frontend/src/download.js
@ -1,3 +1,4 @@
+require('./common');
 const FileReceiver = require('./fileReceiver');
 const { notify, findMetric, sendEvent } = require('./utils');
 const bytes = require('bytes');
@ -13,7 +14,6 @@ $(document).ready(function() {
  //link back to homepage
  $('.send-new').attr('href', window.location.origin);

-  if (location.pathname.toString().includes('download')) {
  $('.send-new').click(function(target) {
    target.preventDefault();
    sendEvent('recipient', 'restarted', {
@ -41,8 +41,6 @@ $(document).ready(function() {
    storage.referrer = 'errored-download';
  })

-  }
-
  const filename = $('#dl-filename').html();
  const bytelength = Number($('#dl-bytelength').text());
  const timeToExpiry = Number($('#dl-ttl').text());
--- a/frontend/src/upload.js
+++ b/frontend/src/upload.js
@ -1,4 +1,5 @@
 /* global MAXFILESIZE */
+require('./common');
 const FileSender = require('./fileSender');
 const { notify, gcmCompliant, findMetric, sendEvent, ONE_DAY_IN_MS } = require('./utils');
 const bytes = require('bytes');
@ -18,7 +19,7 @@ if (storage.has('referrer')) {
 }

 $(document).ready(function() {
-  if (!location.pathname.toString().includes('download')) {
+  
  gcmCompliant()
    .catch(err => {
      $('#page-one').attr('hidden', true);
@ -124,7 +125,6 @@ $(document).ready(function() {
    size: 158,
    animation: { duration: 300 }
  });
-  }

  //link back to homepage
  $('.send-new').attr('href', window.location);
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -4,7 +4,7 @@
  "version": "0.2.0",
  "author": "Mozilla (https://mozilla.org)",
  "dependencies": {
-    "aws-sdk": "^2.87.0",
+    "aws-sdk": "^2.88.0",
    "body-parser": "^1.17.2",
    "bytes": "^2.5.0",
    "connect-busboy": "0.0.2",
@ -12,7 +12,7 @@
    "cross-env": "^5.0.1",
    "express": "^4.15.3",
    "express-handlebars": "^3.0.0",
-    "helmet": "^3.6.1",
+    "helmet": "^3.8.0",
    "jquery": "^3.2.1",
    "jquery-circle-progress": "^1.2.2",
    "l20n": "^5.0.0",
@ -20,14 +20,11 @@
    "raven": "^2.1.0",
    "raven-js": "^3.17.0",
    "redis": "^2.7.1",
-    "selenium-webdriver": "^3.4.0",
-    "supertest": "^3.0.0",
-    "testpilot-ga": "^0.3.0",
-    "uglify-es": "3.0.19"
+    "testpilot-ga": "^0.3.0"
  },
  "devDependencies": {
    "browserify": "^14.4.0",
-    "eslint": "^4.2.0",
+    "eslint": "^4.3.0",
    "eslint-plugin-mocha": "^4.11.0",
    "eslint-plugin-node": "^5.1.1",
    "eslint-plugin-security": "^1.4.0",
@ -36,10 +33,12 @@
    "npm-run-all": "^4.0.2",
    "prettier": "^1.5.3",
    "proxyquire": "^1.8.0",
+    "selenium-webdriver": "^3.4.0",
    "sinon": "^2.3.8",
    "stylelint": "^7.13.0",
    "stylelint-config-standard": "^16.0.0",
-    "watchify": "^3.9.0"
+    "supertest": "^3.0.0",
+    "uglifyify": "^4.0.3"
  },
  "engines": {
    "node": ">=8.0.0"
@ -48,15 +47,19 @@
  "license": "MPL-2.0",
  "repository": "mozilla/send",
  "scripts": {
-    "predocker": "browserify frontend/src/main.js | uglifyjs > public/bundle.js && npm run version",
-    "dev": "npm run version && watchify frontend/src/main.js -o public/bundle.js -d | node server/server",
+    "build": "npm-run-all build:*",
+    "build:upload": "browserify frontend/src/upload.js -g uglifyify -o public/upload.js",
+    "build:download": "browserify frontend/src/download.js -g uglifyify -o public/download.js",
+    "build:version": "node scripts/version",
+    "dev": "npm run build && npm start",
    "format": "prettier '{frontend/src/,scripts/,server/,test/}*.js' 'public/*.css' --single-quote --write",
    "lint": "npm-run-all lint:*",
    "lint:css": "stylelint 'public/*.css'",
    "lint:js": "eslint .",
    "start": "node server/server",
-    "test": "mocha test/unit && mocha test/server && npm run test-browser && node test/frontend/driver.js",
-    "test-browser": "browserify test/frontend/frontend.bundle.js -o test/frontend/bundle.js -d",
-    "version": "node scripts/version"
+    "test": "npm-run-all test:*",
+    "test:unit": "mocha test/unit",
+    "test:server": "mocha test/server",
+    "test:browser": "browserify test/frontend/frontend.bundle.js -o test/frontend/bundle.js -d && node test/frontend/driver.js"
  }
 }
--- a/server/server.js
+++ b/server/server.js
@ -124,7 +124,7 @@ app.get('/download/:id', (req, res) => {
          })
      })
      .catch(() => {
-        res.render('download');
+        res.status(404).render('notfound');
      });
  });
 });
--- a/views/download.handlebars
+++ b/views/download.handlebars
@ -1,5 +1,5 @@
 <div id="download">
-  {{#if filename}}
+  <script src="/download.js"></script>
  <div id="download-page-one">
    <div class="title">
      <span id="dl-filename"
@ -36,13 +36,4 @@
  </div>

  <a class="send-new" data-l10n-id="sendYourFilesLink"></a>
-  {{else}}
-  <div class="title" data-l10n-id="expiredPageHeader"></div>
-
-  <div class="share-window">
-    <img src="/resources/illustration_expired.svg" id="expired-img" data-l10n-id="linkExpiredAlt"/>
-  </div>
-  <div class="expired-description" data-l10n-id="uploadPageExplainer"></div>
-  <a class="send-new" id="expired-send-new" data-l10n-id="sendYourFilesLink"></a>
-  {{/if}}
 </div>
--- a/views/index.handlebars
+++ b/views/index.handlebars
@ -1,4 +1,5 @@
 <div id="page-one">
+  <script src="/upload.js"></script>
  <div class="title" data-l10n-id="uploadPageHeader"></div>
  <div class="description">
    <div data-l10n-id="uploadPageExplainer"></div>
--- a/views/layouts/main.handlebars
+++ b/views/layouts/main.handlebars
@ -3,7 +3,6 @@
 <head>
  <title>Firefox Send</title>
  <script src="/jsconfig.js"></script>
-  <script src="/bundle.js"></script>
  <link rel="stylesheet" type="text/css" href="/main.css" />
  <link rel="stylesheet" href="https://code.cdn.mozilla.net/fonts/fira.css">

--- a/views/notfound.handlebars
+++ b/views/notfound.handlebars
@ -0,0 +1,8 @@
+<div id="download">
+<div class="title" data-l10n-id="expiredPageHeader"></div>
+<div class="share-window">
+  <img src="/resources/illustration_expired.svg" id="expired-img" data-l10n-id="linkExpiredAlt"/>
+</div>
+<div class="expired-description" data-l10n-id="uploadPageExplainer"></div>
+<a class="send-new" id="expired-send-new" data-l10n-id="sendYourFilesLink"></a>
+</div>