Merge pull request #832 from hypothesis/update-angular

Update AngularJS to 1.7.x

package.json

@@ -8,10 +8,10 @@
   "repository": "hypothesis/client",
   "devDependencies": {
     "@octokit/rest": "^15.13.0",
-    "angular": "^1.6.9",
-    "angular-mocks": "^1.6.9",
-    "angular-route": "^1.6.9",
-    "angular-sanitize": "^1.6.9",
+    "angular": "^1.7.5",
+    "angular-mocks": "^1.7.5",
+    "angular-route": "^1.7.5",
+    "angular-sanitize": "^1.7.5",
     "angular-toastr": "^1.7.0",
     "angulartics": "0.17.2",
     "autofill-event": "0.0.1",

src/sidebar/components/annotation-viewer-content.js

@@ -33,8 +33,10 @@ function AnnotationViewerContentController (
 
   const id = $routeParams.id;
 
-  this.search.update = function (query) {
-    $location.path('/stream').search('q', query);
+  this.$onInit = () => {
+    this.search.update = function (query) {
+      $location.path('/stream').search('q', query);
+    };
   };
 
   store.subscribe(function () {

src/sidebar/components/annotation.js

@@ -99,7 +99,7 @@ function AnnotationController(
     * All initialization code except for assigning the controller instance's
     * methods goes here.
     */
-  function init() {
+  this.$onInit = () => {
     /** Determines whether controls to expand/collapse the annotation body
      * are displayed adjacent to the tags field.
      */
@@ -156,7 +156,7 @@ function AnnotationController(
         self.edit();
       }
     }
-  }
+  };
 
   /** Save this annotation if it's a new highlight.
    *
@@ -569,8 +569,6 @@ function AnnotationController(
     }
     return self.group().type !== 'private';
   };
-
-  init();
 }
 
 module.exports = {

src/sidebar/components/sidebar-content.js

@@ -202,10 +202,12 @@ function SidebarContentController(
     streamer.connect();
   });
 
-  // If the user is logged in, we connect nevertheless
-  if (this.auth.status === 'logged-in') {
-    streamer.connect();
-  }
+  this.$onInit = () => {
+    // If the user is logged in, we connect nevertheless
+    if (this.auth.status === 'logged-in') {
+      streamer.connect();
+    }
+  };
 
   $scope.$on(events.USER_CHANGED, function () {
     streamer.reconnect();

src/sidebar/components/stream-content.js

@@ -52,15 +52,6 @@ function StreamContentController(
     store.setForceVisible(id, true);
   };
 
-  Object.assign(this.search, {
-    query: function () {
-      return $routeParams.q || '';
-    },
-    update: function (q) {
-      $location.search({q: q});
-    },
-  });
-
   store.subscribe(function () {
     self.rootThread = rootThread.thread(store.getState());
   });
@@ -69,6 +60,11 @@ function StreamContentController(
   store.setSortKey('Newest');
 
   this.loadMore = fetch;
+
+  this.$onInit = () => {
+    this.search.query = () => $routeParams.q || '';
+    this.search.update = q => $location.search({ q });
+  };
 }
 
 module.exports = {

src/sidebar/components/svg-icon.js

@@ -16,10 +16,12 @@ const icons = {
 
 // @ngInject
 function SvgIconController($element) {
-  if (!icons[this.name]) {
-    throw new Error('Unknown icon: ' + this.name);
-  }
-  $element[0].innerHTML = icons[this.name];
+  this.$onInit = () => {
+    if (!icons[this.name]) {
+      throw new Error('Unknown icon: ' + this.name);
+    }
+    $element[0].innerHTML = icons[this.name];
+  };
 }
 
 module.exports = {

src/sidebar/components/test/annotation-test.js

@@ -151,8 +151,7 @@ describe('annotation', function() {
         })
         .component('markdown', {
           bindings: require('../markdown').bindings,
-        })
-        .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+        });
     });
 
     beforeEach(angular.mock.module('h'));

src/sidebar/components/test/annotation-viewer-content-test.js

@@ -35,8 +35,7 @@ describe('annotationViewerContent', function () {
   before(function () {
     angular.module('h', [])
       .component('annotationViewerContent',
-        require('../annotation-viewer-content'))
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+        require('../annotation-viewer-content'));
   });
 
   beforeEach(angular.mock.module('h'));

src/sidebar/components/test/hypothesis-app-test.js

@@ -57,8 +57,7 @@ describe('sidebar.components.hypothesis-app', function () {
     }));
 
     angular.module('h', [])
-      .component('hypothesisApp', component)
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+      .component('hypothesisApp', component);
   });
 
   beforeEach(angular.mock.module('h'));

src/sidebar/components/test/sidebar-content-test.js

@@ -67,8 +67,7 @@ describe('sidebar.components.sidebar-content', function () {
           angular: angular,
           '../search-client': FakeSearchClient,
         })
-      ))
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+      ));
   });
 
   beforeEach(angular.mock.module('h'));

src/sidebar/components/test/stream-content-test.js

@@ -26,8 +26,7 @@ describe('StreamContentController', function () {
 
   before(function () {
     angular.module('h', [])
-      .component('streamContent', require('../stream-content'))
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+      .component('streamContent', require('../stream-content'));
   });
 
   beforeEach(function () {

src/sidebar/components/test/svg-icon-test.js

@@ -7,8 +7,7 @@ const util = require('../../directive/test/util');
 describe('svgIcon', function () {
   before(function () {
     angular.module('app', [])
-      .component('svgIcon', require('../svg-icon'))
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+      .component('svgIcon', require('../svg-icon'));
   });
 
   beforeEach(function () {

src/sidebar/components/test/thread-list-test.js

@@ -115,8 +115,7 @@ describe('threadList', function () {
 
   before(function () {
     angular.module('app', [])
-      .component('threadList', threadList)
-      .config(($compileProvider) => $compileProvider.preAssignBindingsEnabled(true));
+      .component('threadList', threadList);
   });
 
   beforeEach(function () {

src/sidebar/components/thread-list.js

@@ -70,26 +70,29 @@ function ThreadListController($element, $scope, settings, VirtualThreadList) {
   const options = Object.assign({
     scrollRoot: this.scrollRoot,
   }, virtualThreadOptions);
-
-  const visibleThreads = new VirtualThreadList($scope, window, this.thread, options);
-  visibleThreads.on('changed', function (state) {
-    self.virtualThreadList = {
-      visibleThreads: state.visibleThreads,
-      invisibleThreads: state.invisibleThreads,
-      offscreenUpperHeight: state.offscreenUpperHeight + 'px',
-      offscreenLowerHeight: state.offscreenLowerHeight + 'px',
-    };
-
-    scopeTimeout($scope, function () {
-      state.visibleThreads.forEach(function (thread) {
-        const height = getThreadHeight(thread.id);
-        if (!height) {
-          return;
-        }
-        visibleThreads.setThreadHeight(thread.id, height);
-      });
-    }, 50);
-  });
+  let visibleThreads;
+
+  this.$onInit = () => {
+    visibleThreads = new VirtualThreadList($scope, window, this.thread, options);
+    visibleThreads.on('changed', function (state) {
+      self.virtualThreadList = {
+        visibleThreads: state.visibleThreads,
+        invisibleThreads: state.invisibleThreads,
+        offscreenUpperHeight: state.offscreenUpperHeight + 'px',
+        offscreenLowerHeight: state.offscreenLowerHeight + 'px',
+      };
+
+      scopeTimeout($scope, function () {
+        state.visibleThreads.forEach(function (thread) {
+          const height = getThreadHeight(thread.id);
+          if (!height) {
+            return;
+          }
+          visibleThreads.setThreadHeight(thread.id, height);
+        });
+      }, 50);
+    });
+  };
 
   /**
    * Return the vertical scroll offset for the document in order to position the
@@ -134,7 +137,7 @@ function ThreadListController($element, $scope, settings, VirtualThreadList) {
   });
 
   this.$onChanges = function (changes) {
-    if (changes.thread) {
+    if (changes.thread && visibleThreads) {
       visibleThreads.setRootThread(changes.thread.currentValue);
     }
   };

src/sidebar/index.js

@@ -95,19 +95,6 @@ function configureToastr(toastrConfig) {
   });
 }
 
-// @ngInject
-function configureCompile($compileProvider) {
-  // Make component bindings available in controller constructor. When
-  // pre-assigned bindings is off, as it is by default in Angular >= 1.6.0,
-  // bindings are only available during and after the controller's `$onInit`
-  // method.
-  //
-  // This migration helper is being removed in Angular 1.7.0. To see which
-  // components need updating, look for uses of `preAssignBindingsEnabled` in
-  // tests.
-  $compileProvider.preAssignBindingsEnabled(true);
-}
-
 // @ngInject
 function setupHttp($http, streamer) {
   $http.defaults.headers.common['X-Client-Id'] = streamer.clientId;
@@ -213,7 +200,6 @@ function startAngularApp(config) {
   .value('time', require('./util/time'))
   .value('urlEncodeFilter', require('./filter/url').encode)
 
-  .config(configureCompile)
   .config(configureLocation)
   .config(configureRoutes)
   .config(configureToastr)

yarn.lock

@@ -169,30 +169,30 @@ ancestors@0.0.3:
   resolved "https://registry.yarnpkg.com/ancestors/-/ancestors-0.0.3.tgz#124eb944447d68b302057047d15d077a9da5179d"
   integrity sha1-Ek65RER9aLMCBXBH0V0Hep2lF50=
 
-angular-mocks@^1.6.9:
-  version "1.6.10"
-  resolved "https://registry.yarnpkg.com/angular-mocks/-/angular-mocks-1.6.10.tgz#6a139e43c461d0c9a5a1acebc91e63db16031176"
-  integrity sha512-1865/NmqHNogibNoglY1MGBjx882iu2hI46BBhYDWyz0C4TDM5ER8H8SnYwQKUUG4RXMDsJizszEQ2BEoYKV9w==
+angular-mocks@^1.7.5:
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/angular-mocks/-/angular-mocks-1.7.5.tgz#c8baba5a06ed60b934697026b492169626af384b"
+  integrity sha512-I+Ue2Bkx6R9W5178DYrNvzjIdGh4wKKoCWsgz8dc7ysH4mA70Q3M9v5xRF0RUu7r+2CZj+nDeUecvh2paxcYvg==
 
-angular-route@^1.6.9:
-  version "1.6.10"
-  resolved "https://registry.yarnpkg.com/angular-route/-/angular-route-1.6.10.tgz#4247a32eab19495624623e96c1626dfba17ebf21"
-  integrity sha512-BxjrjQNCbVqQKyB3nHjNI8zSUwhnQWFZnSBv5BZ336VbMKhWu74ad5xpFx5VMk6WyHlmMGDoRagzB6AKkRcvKA==
+angular-route@^1.7.5:
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/angular-route/-/angular-route-1.7.5.tgz#34a3648c407a14a030d075cf485318e33ba23f0e"
+  integrity sha512-7KfyEVVOWTI+jTY/j5rUNCIHGRyeCOx7YqZI/Ci3IbDK7GIsy6xH+hS5ai0Xi0sLjzDZ0PUDO4gBn+K0dVtlOg==
 
-angular-sanitize@^1.6.9:
-  version "1.6.10"
-  resolved "https://registry.yarnpkg.com/angular-sanitize/-/angular-sanitize-1.6.10.tgz#635a362afb2dd040179f17d3a5455962b2c1918f"
-  integrity sha512-01i1Xoq9ykUrsoYQMSB6dWZmPp9Df5hfCqMAGGzJBWZ7L2WY0OtUphdI0YvR8ZF9lAsWtGNtsEFilObjq5nTgQ==
+angular-sanitize@^1.7.5:
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/angular-sanitize/-/angular-sanitize-1.7.5.tgz#75d49e15071ca9c70581e76d20940f26372e24d2"
+  integrity sha512-wjKCJOIwrkEvfD0keTnKGi6We13gtoCAQIHcdoqyoo3gwvcgNfYymVQIS3+iCGVcjfWz0jHuS3KgB4ysRWsTTA==
 
 angular-toastr@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/angular-toastr/-/angular-toastr-1.7.0.tgz#7fdf9ef61cb4abee7a8818eb3d9798c057d4eb7f"
   integrity sha1-f9+e9hy0q+56iBjrPZeYwFfU638=
 
-angular@^1.6.9:
-  version "1.6.10"
-  resolved "https://registry.yarnpkg.com/angular/-/angular-1.6.10.tgz#eed3080a34d29d0f681ff119b18ce294e3f74826"
-  integrity sha512-PCZ5/hVdvPQiYyH0VwsPjrErPHRcITnaXxhksceOXgtJeesKHLA7KDu4X/yvcAi+1zdGgGF+9pDxkJvghXI9Wg==
+angular@^1.7.5:
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/angular/-/angular-1.7.5.tgz#d1c1c01c6f5dc835638f3f9aa51012857bdac49e"
+  integrity sha512-760183yxtGzni740IBTieNuWLtPNAoMqvmC0Z62UoU0I3nqk+VJuO3JbQAXOyvo3Oy/ZsdNQwrSTh/B0OQZjNw==
 
 angulartics@0.17.2:
   version "0.17.2"