Convert remaining of reducers to ES modules (#2739)

* Convert async-request reducer to ES modules

* Convert breakpoints reducer to es modules

* Convert coverage reducer to es modules

* Convert pause reducer to es modules

* Convert main reducer to es modules

* Convert ui reducer to es modules

* Export update function of reducers by default

* Set proper types for reducers' state argument

* Add flow type-checking to `test-all` command

package.json

@@ -28,7 +28,7 @@
     "lint-fix": "yarn lint-js -- --fix",
     "test": "jest",
     "test-coverage": "yarn test -- --coverage",
-    "test-all": "yarn test; yarn lint",
+    "test-all": "yarn test; yarn lint; yarn flow",
     "firefox": "start-firefox --start --location https://devtools-html.github.io/debugger-examples/",
     "chrome": "start-chrome --location https://devtools-html.github.io/debugger-examples/",
     "copy-assets": "node bin/copy-assets --symlink",

src/reducers/async-requests.js

@@ -24,4 +24,4 @@ function update(state = initialState, action) {
   return state;
 }
 
-module.exports = update;
+export default update;

src/reducers/breakpoints.js

@@ -8,11 +8,11 @@
  * @module reducers/breakpoints
  */
 
-const fromJS = require("../utils/fromJS");
-const { updateObj } = require("../utils/utils");
-const I = require("immutable");
-const makeRecord = require("../utils/makeRecord");
-const { prefs } = require("../utils/prefs");
+import fromJS from "../utils/fromJS";
+import { updateObj } from "../utils/utils";
+import * as I from "immutable";
+import makeRecord from "../utils/makeRecord";
+import { prefs } from "../utils/prefs";
 
 import type { Breakpoint, Location } from "../types";
 import type { Action } from "../actions/types";
@@ -24,7 +24,7 @@ export type BreakpointsState = {
   breakpointsDisabled: false
 };
 
-const State = makeRecord(
+export const State = makeRecord(
   ({
     breakpoints: I.Map(),
     pendingBreakpoints: restorePendingBreakpoints(),
@@ -50,15 +50,15 @@ function locationMoved(location, newLocation) {
   );
 }
 
-function makeLocationId(location: Location) {
+export function makeLocationId(location: Location) {
   return `${location.sourceId}:${location.line}`;
 }
 
 function allBreakpointsDisabled(state) {
   return state.breakpoints.every(x => x.disabled);
 }
 
-function update(state = State(), action: Action) {
+function update(state: Record<BreakpointsState> = State(), action: Action) {
   switch (action.type) {
     case "ADD_BREAKPOINT": {
       const newState = addBreakpoint(state, action);
@@ -229,43 +229,33 @@ function restorePendingBreakpoints() {
 
 type OuterState = { breakpoints: Record<BreakpointsState> };
 
-function getBreakpoint(state: OuterState, location: Location) {
+export function getBreakpoint(state: OuterState, location: Location) {
   return state.breakpoints.breakpoints.get(makeLocationId(location));
 }
 
-function getBreakpoints(state: OuterState) {
+export function getBreakpoints(state: OuterState) {
   return state.breakpoints.breakpoints;
 }
 
-function getBreakpointsForSource(state: OuterState, sourceId: string) {
+export function getBreakpointsForSource(state: OuterState, sourceId: string) {
   return state.breakpoints.breakpoints.filter(bp => {
     return bp.location.sourceId === sourceId;
   });
 }
 
-function getBreakpointsDisabled(state: OuterState): boolean {
+export function getBreakpointsDisabled(state: OuterState): boolean {
   return state.breakpoints.get("breakpointsDisabled");
 }
 
-function getBreakpointsLoading(state: OuterState) {
+export function getBreakpointsLoading(state: OuterState) {
   const breakpoints = getBreakpoints(state);
   const isLoading = !!breakpoints.valueSeq().filter(bp => bp.loading).first();
 
   return breakpoints.size > 0 && isLoading;
 }
 
-function getPendingBreakpoints(state: OuterState) {
+export function getPendingBreakpoints(state: OuterState) {
   return state.breakpoints.pendingBreakpoints;
 }
 
-module.exports = {
-  State,
-  update,
-  makeLocationId,
-  getBreakpoint,
-  getBreakpoints,
-  getBreakpointsForSource,
-  getBreakpointsDisabled,
-  getBreakpointsLoading,
-  getPendingBreakpoints
-};
+export default update;

src/reducers/coverage.js

@@ -5,9 +5,9 @@
  * @module reducers/coverage
  */
 
-const makeRecord = require("../utils/makeRecord");
-const I = require("immutable");
-const fromJS = require("../utils/fromJS");
+import makeRecord from "../utils/makeRecord";
+import * as I from "immutable";
+import fromJS from "../utils/fromJS";
 
 import constants from "../constants";
 import type { Action } from "../actions/types";
@@ -18,14 +18,17 @@ export type CoverageState = {
   hitCount: Object
 };
 
-const State = makeRecord(
+export const State = makeRecord(
   ({
     coverageOn: false,
     hitCount: I.Map()
   }: CoverageState)
 );
 
-function update(state = State(), action: Action): Record<CoverageState> {
+function update(
+  state: Record<CoverageState> = State(),
+  action: Action
+): Record<CoverageState> {
   switch (action.type) {
     case constants.RECORD_COVERAGE:
       return state
@@ -42,18 +45,13 @@ function update(state = State(), action: Action): Record<CoverageState> {
 // https://github.com/devtools-html/debugger.html/blob/master/src/reducers/sources.js#L179-L185
 type OuterState = { coverage: Record<CoverageState> };
 
-function getHitCountForSource(state: OuterState, sourceId: ?string) {
+export function getHitCountForSource(state: OuterState, sourceId: ?string) {
   const hitCount = state.coverage.get("hitCount");
   return hitCount.get(sourceId);
 }
 
-function getCoverageEnabled(state: OuterState) {
+export function getCoverageEnabled(state: OuterState) {
   return state.coverage.get("coverageOn");
 }
 
-module.exports = {
-  State,
-  update,
-  getHitCountForSource,
-  getCoverageEnabled
-};
+export default update;

src/reducers/event-listeners.js

@@ -10,7 +10,7 @@ const initialState = {
   fetchingListeners: false
 };
 
-export function update(state = initialState, action, emit) {
+function update(state = initialState, action, emit) {
   switch (action.type) {
     case constants.UPDATE_EVENT_BREAKPOINTS:
       state.activeEventNames = action.eventNames;
@@ -34,3 +34,5 @@ export function update(state = initialState, action, emit) {
 export function getEventListeners(state) {
   return state.eventListeners.listeners;
 }
+
+export default update;

src/reducers/expressions.js

@@ -19,7 +19,7 @@ export const State = makeRecord(
   }: ExpressionState)
 );
 
-export function update(
+function update(
   state: Record<ExpressionState> = State(),
   action: Action
 ): Record<ExpressionState> {
@@ -116,3 +116,5 @@ export function getVisibleExpressions(state: OuterState) {
 export function getExpression(state: OuterState, input: string) {
   return getExpressions(state).find(exp => exp.input == input);
 }
+
+export default update;

src/reducers/index.js

@@ -2,22 +2,22 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-const expressions = require("./expressions");
-const eventListeners = require("./event-listeners");
-const sources = require("./sources");
-const breakpoints = require("./breakpoints");
-const asyncRequests = require("./async-requests");
-const pause = require("./pause");
-const ui = require("./ui");
-const coverage = require("./coverage");
+import expressions from "./expressions";
+import eventListeners from "./event-listeners";
+import sources from "./sources";
+import breakpoints from "./breakpoints";
+import asyncRequests from "./async-requests";
+import pause from "./pause";
+import ui from "./ui";
+import coverage from "./coverage";
 
-module.exports = {
-  expressions: expressions.update,
-  eventListeners: eventListeners.update,
-  sources: sources.update,
-  breakpoints: breakpoints.update,
-  pause: pause.update,
+export default {
+  expressions,
+  eventListeners,
+  sources,
+  breakpoints,
   asyncRequests,
-  ui: ui.update,
-  coverage: coverage.update
+  pause,
+  ui,
+  coverage
 };

src/reducers/pause.js

@@ -3,10 +3,10 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-const fromJS = require("../utils/fromJS");
-const makeRecord = require("../utils/makeRecord");
-const { prefs } = require("../utils/prefs");
-const I = require("immutable");
+import fromJS from "../utils/fromJS";
+import makeRecord from "../utils/makeRecord";
+import { prefs } from "../utils/prefs";
+import * as I from "immutable";
 
 import constants from "../constants";
 import type { Frame, Pause } from "../types";
@@ -24,7 +24,7 @@ type PauseState = {
   debuggeeUrl: string
 };
 
-const State = makeRecord(
+export const State = makeRecord(
   ({
     pause: undefined,
     isWaitingOnBreak: false,
@@ -37,7 +37,10 @@ const State = makeRecord(
   }: PauseState)
 );
 
-function update(state = State(), action: Action): Record<PauseState> {
+function update(
+  state: Record<PauseState> = State(),
+  action: Action
+): Record<PauseState> {
   switch (action.type) {
     case constants.PAUSED: {
       const { selectedFrameId, frames, loadedObjects, pauseInfo } = action;
@@ -135,39 +138,39 @@ function update(state = State(), action: Action): Record<PauseState> {
 // (right now) to type those wrapped functions.
 type OuterState = { pause: Record<PauseState> };
 
-function getPause(state: OuterState) {
+export function getPause(state: OuterState) {
   return state.pause.get("pause");
 }
 
-function getLoadedObjects(state: OuterState) {
+export function getLoadedObjects(state: OuterState) {
   return state.pause.get("loadedObjects");
 }
 
-function getLoadedObject(state: OuterState, objectId: string) {
+export function getLoadedObject(state: OuterState, objectId: string) {
   return getLoadedObjects(state).get(objectId);
 }
 
-function getObjectProperties(state: OuterState, parentId: string) {
+export function getObjectProperties(state: OuterState, parentId: string) {
   return getLoadedObjects(state).filter(obj => obj.get("parentId") == parentId);
 }
 
-function getIsWaitingOnBreak(state: OuterState) {
+export function getIsWaitingOnBreak(state: OuterState) {
   return state.pause.get("isWaitingOnBreak");
 }
 
-function getShouldPauseOnExceptions(state: OuterState) {
+export function getShouldPauseOnExceptions(state: OuterState) {
   return state.pause.get("shouldPauseOnExceptions");
 }
 
-function getShouldIgnoreCaughtExceptions(state: OuterState) {
+export function getShouldIgnoreCaughtExceptions(state: OuterState) {
   return state.pause.get("shouldIgnoreCaughtExceptions");
 }
 
-function getFrames(state: OuterState) {
+export function getFrames(state: OuterState) {
   return state.pause.get("frames");
 }
 
-function getSelectedFrame(state: OuterState) {
+export function getSelectedFrame(state: OuterState) {
   const selectedFrameId = state.pause.get("selectedFrameId");
   const frames = state.pause.get("frames");
   if (!frames) {
@@ -177,28 +180,14 @@ function getSelectedFrame(state: OuterState) {
   return frames.find(frame => frame.get("id") == selectedFrameId).toJS();
 }
 
-function getDebuggeeUrl(state: OuterState) {
+export function getDebuggeeUrl(state: OuterState) {
   return state.pause.get("debuggeeUrl");
 }
 
 // NOTE: currently only used for chrome
-function getChromeScopes(state: OuterState) {
+export function getChromeScopes(state: OuterState) {
   const frame = getSelectedFrame(state);
   return frame ? frame.scopeChain : undefined;
 }
 
-module.exports = {
-  State,
-  update,
-  getPause,
-  getChromeScopes,
-  getLoadedObjects,
-  getLoadedObject,
-  getObjectProperties,
-  getIsWaitingOnBreak,
-  getShouldPauseOnExceptions,
-  getShouldIgnoreCaughtExceptions,
-  getFrames,
-  getSelectedFrame,
-  getDebuggeeUrl
-};
+export default update;

src/reducers/sources.js

@@ -44,7 +44,7 @@ export const State = makeRecord(
   }: SourcesState)
 );
 
-export function update(
+function update(
   state: Record<SourcesState> = State(),
   action: Action
 ): Record<SourcesState> {
@@ -326,3 +326,5 @@ export function getPrettySource(state: OuterState, id: string) {
 
   return getSourceByURL(state, getPrettySourceURL(source.get("url")));
 }
+
+export default update;

src/reducers/tests/sources.js

@@ -2,7 +2,7 @@
 declare var describe: (name: string, func: () => void) => void;
 declare var it: (desc: string, func: () => void) => void;
 
-import { State, update } from "../sources";
+import update, { State } from "../sources";
 import { foobar } from "../../test/fixtures";
 const fakeSources = foobar.sources.sources;
 import expect from "expect.js";