Port ComputedLoaderMsg to mobx 4

Author: tanx

src/computed/loader-msg.js

@@ -2,14 +2,14 @@
  * @fileOverview computed values that are used in loader UI components.
  */
 
-import { computed, extendObservable } from 'mobx';
+import { extendObservable } from 'mobx';
 
 const ComputedLoaderMsg = store => {
   extendObservable(store, {
-    loadingMsg: computed(() => {
+    get loadingMsg() {
       const { percentSynced: percent } = store;
       return getLoadingMsg(percent);
-    }),
+    },
   });
 };
 

test/unit/computed/loader-msg.spec.js

@@ -23,22 +23,31 @@ describe('Computed Loader Msg Unit Tests', () => {
       expect(store.loadingMsg, 'to equal', LOADING_COPY_START);
     });
 
-    it('should work for < 0 and > 1 percentages', () => {
+    it('should work for < 0 percentages', () => {
       store.percentSynced = -1;
       ComputedLoaderMsg(store);
       expect(store.loadingMsg, 'to equal', LOADING_COPY_START);
+    });
+
+    it('should work for > 1 percentages', () => {
       store.percentSynced = 1.01;
       ComputedLoaderMsg(store);
       expect(store.loadingMsg, 'to equal', LOADING_COPY_END);
     });
 
-    it('should work for each milestone percentage', () => {
+    it('should work for 1st milestone percentage', () => {
       store.percentSynced = 0.1;
       ComputedLoaderMsg(store);
       expect(store.loadingMsg, 'to equal', LOADING_COPY_START);
+    });
+
+    it('should work for 2nd milestone percentage', () => {
       store.percentSynced = LOADING_PERCENT_MID;
       ComputedLoaderMsg(store);
       expect(store.loadingMsg, 'to equal', LOADING_COPY_MID);
+    });
+
+    it('should work for 3rd milestone percentage', () => {
       store.percentSynced = LOADING_PERCENT_END;
       ComputedLoaderMsg(store);
       expect(store.loadingMsg, 'to equal', LOADING_COPY_END);