Bug 1428816 - Rename deviceListState to loadableState. r=ochameau draft
authorJ. Ryan Stinnett <jryans@gmail.com>
Thu, 08 Feb 2018 15:22:59 -0600
changeset 758576 23fb2bb002b4464ee01244bf9934236bcc404f3c
parent 758497 5e9bd04333f20e00911b8c1dfbf2b2e070c61e2d
child 758577 6249f7f609e2d79222c74735ce37d0bbcc7ba14b
push id100108
push userbmo:jryans@gmail.com
push dateThu, 22 Feb 2018 18:02:07 +0000
reviewersochameau
bugs1428816
milestone60.0a1
Bug 1428816 - Rename deviceListState to loadableState. r=ochameau MozReview-Commit-ID: AWIP5njHV3M
devtools/client/responsive.html/components/DevicePixelRatioSelector.js
devtools/client/responsive.html/components/DeviceSelector.js
devtools/client/responsive.html/reducers/devices.js
devtools/client/responsive.html/test/browser/browser_device_change.js
devtools/client/responsive.html/test/browser/browser_device_custom.js
devtools/client/responsive.html/test/browser/browser_device_custom_remove.js
devtools/client/responsive.html/test/browser/browser_device_modal_error.js
devtools/client/responsive.html/test/browser/browser_device_modal_exit.js
devtools/client/responsive.html/test/browser/browser_device_modal_submit.js
devtools/client/responsive.html/test/browser/browser_device_pixel_ratio_change.js
devtools/client/responsive.html/test/browser/browser_touch_device.js
devtools/client/responsive.html/types.js
--- a/devtools/client/responsive.html/components/DevicePixelRatioSelector.js
+++ b/devtools/client/responsive.html/components/DevicePixelRatioSelector.js
@@ -87,17 +87,17 @@ class DevicePixelRatioSelector extends P
       }
     }
 
     if (!PIXEL_RATIO_PRESET.includes(displayPixelRatio)) {
       hiddenOptions.push(displayPixelRatio);
     }
 
     let state = devices.listState;
-    let isDisabled = (state !== Types.deviceListState.LOADED) || (selectedDevice !== "");
+    let isDisabled = (state !== Types.loadableState.LOADED) || (selectedDevice !== "");
     let selectorClass = "";
     let title;
 
     if (isDisabled) {
       selectorClass += " disabled";
       title = getFormatStr("responsive.devicePixelRatio.auto", selectedDevice);
     } else {
       title = getStr("responsive.changeDevicePixelRatio");
@@ -108,17 +108,17 @@ class DevicePixelRatioSelector extends P
     }
 
     if (this.state.isFocused) {
       selectorClass += " focused";
     }
 
     let listContent = PIXEL_RATIO_PRESET.map(createVisibleOption);
 
-    if (state == Types.deviceListState.LOADED) {
+    if (state == Types.loadableState.LOADED) {
       listContent = listContent.concat(hiddenOptions.map(createHiddenOption));
     }
 
     return dom.select(
       {
         id: "global-device-pixel-ratio-selector",
         value: selectedPixelRatio.value || displayPixelRatio,
         disabled: isDisabled,
--- a/devtools/client/responsive.html/components/DeviceSelector.js
+++ b/devtools/client/responsive.html/components/DeviceSelector.js
@@ -75,17 +75,17 @@ class DeviceSelector extends PureCompone
     let selectClass = "viewport-device-selector";
     if (selectedDevice) {
       selectClass += " selected";
     }
 
     let state = devices.listState;
     let listContent;
 
-    if (state == Types.deviceListState.LOADED) {
+    if (state == Types.loadableState.LOADED) {
       listContent = [
         dom.option({
           value: "",
           title: "",
           disabled: true,
           hidden: true,
         },
         getStr("responsive.noDeviceSelected")),
@@ -95,37 +95,37 @@ class DeviceSelector extends PureCompone
             value: device.name,
             title: "",
           }, device.name);
         }),
         dom.option({
           value: OPEN_DEVICE_MODAL_VALUE,
           title: "",
         }, getStr("responsive.editDeviceList"))];
-    } else if (state == Types.deviceListState.LOADING
-      || state == Types.deviceListState.INITIALIZED) {
+    } else if (state == Types.loadableState.LOADING
+      || state == Types.loadableState.INITIALIZED) {
       listContent = [dom.option({
         value: "",
         title: "",
         disabled: true,
       }, getStr("responsive.deviceListLoading"))];
-    } else if (state == Types.deviceListState.ERROR) {
+    } else if (state == Types.loadableState.ERROR) {
       listContent = [dom.option({
         value: "",
         title: "",
         disabled: true,
       }, getStr("responsive.deviceListError"))];
     }
 
     return dom.select(
       {
         className: selectClass,
         value: selectedDevice,
         title: selectedDevice,
         onChange: this.onSelectChange,
-        disabled: (state !== Types.deviceListState.LOADED),
+        disabled: (state !== Types.loadableState.LOADED),
       },
       ...listContent
     );
   }
 }
 
 module.exports = DeviceSelector;
--- a/devtools/client/responsive.html/reducers/devices.js
+++ b/devtools/client/responsive.html/reducers/devices.js
@@ -16,17 +16,17 @@ const {
 } = require("../actions/index");
 
 const Types = require("../types");
 
 const INITIAL_DEVICES = {
   types: [],
   isModalOpen: false,
   modalOpenedFromViewport: null,
-  listState: Types.deviceListState.INITIALIZED,
+  listState: Types.loadableState.INITIALIZED,
 };
 
 let reducers = {
 
   [ADD_DEVICE](devices, { device, deviceType }) {
     return Object.assign({}, devices, {
       [deviceType]: [...devices[deviceType], device],
     });
@@ -50,29 +50,29 @@ let reducers = {
 
     return Object.assign({}, devices, {
       [deviceType]: newDevices,
     });
   },
 
   [LOAD_DEVICE_LIST_START](devices, action) {
     return Object.assign({}, devices, {
-      listState: Types.deviceListState.LOADING,
+      listState: Types.loadableState.LOADING,
     });
   },
 
   [LOAD_DEVICE_LIST_ERROR](devices, action) {
     return Object.assign({}, devices, {
-      listState: Types.deviceListState.ERROR,
+      listState: Types.loadableState.ERROR,
     });
   },
 
   [LOAD_DEVICE_LIST_END](devices, action) {
     return Object.assign({}, devices, {
-      listState: Types.deviceListState.LOADED,
+      listState: Types.loadableState.LOADED,
     });
   },
 
   [REMOVE_DEVICE](devices, { device, deviceType }) {
     let index = devices[deviceType].indexOf(device);
     if (index < 0) {
       return devices;
     }
--- a/devtools/client/responsive.html/test/browser/browser_device_change.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_change.js
@@ -28,17 +28,17 @@ const testDevice = {
 // Add the new device to the list
 addDeviceForTest(testDevice);
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { store } = ui.toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   // Test defaults
   testViewportDimensions(ui, 320, 480);
   info("Should have default UA at the start of the test");
   await testUserAgent(ui, DEFAULT_UA);
   await testDevicePixelRatio(ui, DEFAULT_DPPX);
   await testTouchEventsOverride(ui, false);
   testViewportDeviceSelectLabel(ui, "no device selected");
@@ -77,17 +77,17 @@ addRDMTask(TEST_URL, async function ({ u
 add_task(async function () {
   const tab = await addTab(TEST_URL);
   const { ui } = await openRDM(tab);
 
   let { store } = ui.toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   // Select device with custom UA
   let reloaded = waitForViewportLoad(ui);
   await selectDevice(ui, "Fake Phone RDM Test");
   await reloaded;
   await waitForViewportResizeTo(ui, testDevice.width, testDevice.height);
   info("Should have device UA now that device is applied");
   await testUserAgent(ui, testDevice.userAgent);
--- a/devtools/client/responsive.html/test/browser/browser_device_custom.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_custom.js
@@ -27,17 +27,17 @@ const TEST_URL = "data:text/html;charset
 const Types = require("devtools/client/responsive.html/types");
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
   let submitButton = document.querySelector("#device-submit-button");
 
   openDeviceModal(ui);
 
   info("Reveal device adder form, check that defaults match the viewport");
   let adderShow = document.querySelector("#device-adder-show");
@@ -68,17 +68,17 @@ addRDMTask(TEST_URL, async function ({ u
 });
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
   let submitButton = document.querySelector("#device-submit-button");
 
   info("Select existing device from the selector");
   await selectDevice(ui, "Test Device");
 
   openDeviceModal(ui);
@@ -111,17 +111,17 @@ addRDMTask(TEST_URL, async function ({ u
 });
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
   let submitButton = document.querySelector("#device-submit-button");
 
   openDeviceModal(ui);
 
   info("Reveal device adder form");
   let adderShow = document.querySelector("#device-adder-show");
@@ -145,17 +145,17 @@ addRDMTask(TEST_URL, async function ({ u
 });
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
 
   // Check if the unicode custom device is present in the list of device options since
   // we want to ensure that unicode device names are not forgotten after restarting RDM
   // see bug 1379687
   info("Look for custom unicode device in device selector");
   let selectorOption = [...deviceSelector.options].find(opt =>
--- a/devtools/client/responsive.html/test/browser/browser_device_custom_remove.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_custom_remove.js
@@ -27,17 +27,17 @@ const device2 = Object.assign({}, device
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   info("Verify that remove buttons affect the correct device");
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
   let submitButton = document.querySelector("#device-submit-button");
 
   openDeviceModal(ui);
 
   info("Reveal device adder form");
   let adderShow = document.querySelector("#device-adder-show");
@@ -90,17 +90,17 @@ addRDMTask(TEST_URL, async function ({ u
 });
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { toolWindow } = ui;
   let { store, document } = toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   let deviceSelector = document.querySelector(".viewport-device-selector");
 
   info("Ensure device 1 is still in device selector");
   let deviceOption1 = [...deviceSelector.options].find(opt => opt.value == device1.name);
   ok(deviceOption1, "Test device 1 option exists");
 
   info("Ensure device 2 is no longer in device selector");
--- a/devtools/client/responsive.html/test/browser/browser_device_modal_error.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_modal_error.js
@@ -18,17 +18,17 @@ add_task(async function () {
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { store, document } = ui.toolWindow;
   let select = document.querySelector(".viewport-device-selector");
 
   // Wait until the viewport has been added and the device list state indicates
   // an error
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.ERROR);
+    && state.devices.listState == Types.loadableState.ERROR);
 
   // The device selector placeholder should be set accordingly
   let placeholder = select.options[select.selectedIndex].innerHTML;
   ok(placeholder == getStr("responsive.deviceListError"),
     "Device selector indicates an error");
 
   // The device selector should be disabled
   ok(select.disabled, "Device selector is disabled");
--- a/devtools/client/responsive.html/test/browser/browser_device_modal_exit.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_modal_exit.js
@@ -10,17 +10,17 @@ const Types = require("devtools/client/r
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { store, document } = ui.toolWindow;
   let modal = document.querySelector("#device-modal-wrapper");
   let closeButton = document.querySelector("#device-close-button");
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   openDeviceModal(ui);
 
   let preferredDevicesBefore = _loadPreferredDevices();
 
   info("Check the first unchecked device and exit the modal.");
   let uncheckedCb = [...document.querySelectorAll(".device-input-checkbox")]
     .filter(cb => !cb.checked)[0];
--- a/devtools/client/responsive.html/test/browser/browser_device_modal_submit.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_modal_submit.js
@@ -24,17 +24,17 @@ const Types = require("devtools/client/r
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { store, document } = ui.toolWindow;
   let modal = document.querySelector("#device-modal-wrapper");
   let select = document.querySelector(".viewport-device-selector");
   let submitButton = document.querySelector("#device-submit-button");
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   openDeviceModal(ui);
 
   info("Checking displayed device checkboxes are checked in the device modal.");
   let checkedCbs = [...document.querySelectorAll(".device-input-checkbox")]
     .filter(cb => cb.checked);
 
   let remoteList = await getDevices();
@@ -111,17 +111,17 @@ addRDMTask(TEST_URL, async function ({ u
 });
 
 addRDMTask(TEST_URL, async function ({ ui }) {
   let { store, document } = ui.toolWindow;
   let select = document.querySelector(".viewport-device-selector");
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 
   openDeviceModal(ui);
 
   let remoteList = await getDevices();
   let featuredCount = remoteList.TYPES.reduce((total, type) => {
     return total + remoteList[type].reduce((subtotal, device) => {
       return subtotal + ((device.os != "fxos" && device.featured) ? 1 : 0);
     }, 0);
--- a/devtools/client/responsive.html/test/browser/browser_device_pixel_ratio_change.js
+++ b/devtools/client/responsive.html/test/browser/browser_device_pixel_ratio_change.js
@@ -33,17 +33,17 @@ addRDMTask(TEST_URL, async function ({ u
   await testChangingDevicePixelRatio(ui);
 });
 
 async function waitStartup(ui) {
   let { store } = ui.toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 }
 
 async function testDefaults(ui) {
   info("Test Defaults");
 
   let dppx = await getViewportDevicePixelRatio(ui);
   is(dppx, DEFAULT_DPPX, "Content has expected devicePixelRatio");
   testViewportDevicePixelRatioSelect(ui, {
--- a/devtools/client/responsive.html/test/browser/browser_touch_device.js
+++ b/devtools/client/responsive.html/test/browser/browser_touch_device.js
@@ -33,17 +33,17 @@ addRDMTask(TEST_URL, async function ({ u
   await testDisableTouchSimulation(ui);
 });
 
 async function waitStartup(ui) {
   let { store } = ui.toolWindow;
 
   // Wait until the viewport has been added and the device list has been loaded
   await waitUntilState(store, state => state.viewports.length == 1
-    && state.devices.listState == Types.deviceListState.LOADED);
+    && state.devices.listState == Types.loadableState.LOADED);
 }
 
 async function testDefaults(ui) {
   info("Test Defaults");
 
   await testTouchEventsOverride(ui, false);
   testViewportDeviceSelectLabel(ui, "no device selected");
 }
--- a/devtools/client/responsive.html/types.js
+++ b/devtools/client/responsive.html/types.js
@@ -46,19 +46,19 @@ const device = {
   os: PropTypes.String,
 
   // Whether or not the device is displayed in the device selector
   displayed: PropTypes.bool,
 
 };
 
 /**
- * An enum containing the possible values for the device list state
+ * An enum containing the possible states for loadable things.
  */
-exports.deviceListState = createEnum([
+exports.loadableState = createEnum([
   "INITIALIZED",
   "LOADING",
   "LOADED",
   "ERROR",
 ]);
 
 /**
  * A list of devices and their types that can be displayed in the viewport.
@@ -88,17 +88,17 @@ exports.devices = {
 
   // Whether or not the device modal is open
   isModalOpen: PropTypes.bool,
 
   // Viewport id that triggered the modal to open
   modalOpenedFromViewport: PropTypes.number,
 
   // Device list state, possible values are exported above in an enum
-  listState: PropTypes.oneOf(Object.keys(exports.deviceListState)),
+  listState: PropTypes.oneOf(Object.keys(exports.loadableState)),
 
 };
 
 /* VIEWPORT */
 
 /**
  * Network throttling state for a given viewport.
  */