[Sources] - switch to loaded state (firefox-devtools#3740)

* SourceState changes completed

* SourceState test case changes

* removed isLoaded/ removed toJS()

* removed loadedState

* Modified utils/Referred isLoaded in test

* fix tests

* fixup mochi

Author: sharathnarayanph

flow-typed/debugger-html.js

@@ -210,7 +210,7 @@ declare module "debugger-html" {
     text?: string,
     contentType?: string,
     error?: string,
-    loading?: boolean
+    loadedState: "unloaded" | "loading" | "loaded"
   };
 
   /**

src/actions/sources.js

@@ -17,7 +17,7 @@ import { setSymbols, setOutOfScopeLocations } from "./ast";
 import { syncBreakpoint } from "./breakpoints";
 import { searchSource } from "./project-text-search";
 
-import { getPrettySourceURL } from "../utils/source";
+import { getPrettySourceURL, isLoaded } from "../utils/source";
 import { createPrettySource } from "./sources/createPrettySource";
 
 import { prefs } from "../utils/prefs";
@@ -303,7 +303,7 @@ export function togglePrettyPrint(sourceId: string) {
   return async ({ dispatch, getState, client, sourceMaps }: ThunkArgs) => {
     const source = getSource(getState(), sourceId).toJS();
 
-    if (source && source.loading) {
+    if (source && !isLoaded(source)) {
       return {};
     }
 

src/actions/sources/createPrettySource.js

@@ -28,7 +28,7 @@ export function createPrettySource(sourceId) {
       text: code,
       contentType: "text/javascript",
       frames,
-      loading: false
+      loadedState: "loaded"
     };
 
     return dispatch({

src/actions/sources/tests/__snapshots__/createPrettySource.js.snap

@@ -9,6 +9,6 @@ Immutable.Map {
   ",
   contentType: "text/javascript",
   frames: undefined,
-  loading: false,
+  loadedState: "loaded",
 }
 `;

src/actions/tests/sources.spec.js

@@ -142,7 +142,7 @@ describe("sources", () => {
     // Don't block on this so we can check the loading state.
     dispatch(actions.loadSourceText({ id: "foo1" }));
     const fooSource = getSource(getState(), "foo1");
-    expect(fooSource.get("loading")).toEqual(true);
+    expect(fooSource.get("loadedState")).toEqual("loading");
   });
 
   it("should indicate an errored source text", async () => {

src/client/firefox/create.js

@@ -41,7 +41,8 @@ export function createSource(
     isPrettyPrinted: false,
     isWasm: supportsWasm && source.introductionType === "wasm",
     sourceMapURL: source.sourceMapURL,
-    isBlackBoxed: false
+    isBlackBoxed: false,
+    loadedState: "unloaded"
   };
 }
 

src/components/Editor/Breakpoints.js

@@ -8,6 +8,7 @@ import actions from "../../actions";
 import { getSelectedSource } from "../../selectors";
 import getVisibleBreakpoints from "../../selectors/visibleBreakpoints";
 import { makeLocationId } from "../../utils/breakpoint";
+import { isLoaded } from "../../utils/source";
 
 import type { SourceRecord, BreakpointsMap } from "../../reducers/types";
 
@@ -21,7 +22,10 @@ class Breakpoints extends Component {
   props: props;
 
   shouldComponentUpdate(nextProps: any) {
-    if (nextProps.selectedSource && nextProps.selectedSource.get("loading")) {
+    if (
+      nextProps.selectedSource &&
+      !isLoaded(nextProps.selectedSource.toJS())
+    ) {
       return false;
     }
 

src/components/Editor/Footer.js

@@ -11,7 +11,7 @@ import Svg from "../shared/Svg";
 
 import classnames from "classnames";
 import { isEnabled } from "devtools-config";
-import { isPretty } from "../../utils/source";
+import { isPretty, isLoaded } from "../../utils/source";
 import { shouldShowFooter, shouldShowPrettyPrint } from "../../utils/editor";
 
 import PaneToggleButton from "../shared/Button/PaneToggle";
@@ -35,7 +35,7 @@ class SourceFooter extends PureComponent {
 
   prettyPrintButton() {
     const { selectedSource, togglePrettyPrint } = this.props;
-    const sourceLoaded = selectedSource && !selectedSource.get("loading");
+    const sourceLoaded = selectedSource && isLoaded(selectedSource.toJS());
 
     if (!shouldShowPrettyPrint(selectedSource)) {
       return;
@@ -62,7 +62,7 @@ class SourceFooter extends PureComponent {
 
   blackBoxButton() {
     const { selectedSource, toggleBlackBox } = this.props;
-    const sourceLoaded = selectedSource && !selectedSource.get("loading");
+    const sourceLoaded = selectedSource && isLoaded(selectedSource.toJS());
 
     const blackboxed = selectedSource.get("isBlackBoxed");
 

src/components/Editor/SearchBar.js

@@ -16,6 +16,7 @@ import {
 import { find, findNext, findPrev, removeOverlay } from "../../utils/editor";
 
 import { getMatches } from "../../utils/search";
+import { isLoaded } from "../../utils/source";
 
 import { scrollList } from "../../utils/result-list";
 import classnames from "classnames";
@@ -144,9 +145,9 @@ class SearchBar extends Component {
       scrollList(this.refs.resultList.refs, this.state.selectedResultIndex);
     }
 
-    const hasLoaded = selectedSource && !selectedSource.get("loading");
+    const hasLoaded = selectedSource && isLoaded(selectedSource.toJS());
     const wasLoading =
-      prevProps.selectedSource && prevProps.selectedSource.get("loading");
+      prevProps.selectedSource && isLoaded(prevProps.selectedSource.toJS());
 
     const doneLoading = wasLoading && hasLoaded;
     const changedFiles =

src/components/Editor/index.js

@@ -10,6 +10,7 @@ import GutterMenu from "./GutterMenu";
 import EditorMenu from "./EditorMenu";
 import { renderConditionalPanel } from "./ConditionalPanel";
 import { debugGlobal } from "devtools-launchpad";
+import { isLoaded } from "../../utils/source";
 
 import {
   getActiveSearchState,
@@ -109,7 +110,7 @@ class Editor extends PureComponent {
       if (this.props.selectedSource) {
         this.showMessage("");
       }
-    } else if (selectedSource.get("loading")) {
+    } else if (!isLoaded(selectedSource.toJS())) {
       this.showMessage(L10N.getStr("loadingText"));
     } else if (selectedSource.get("error")) {
       this.showMessage(selectedSource.get("error"));
@@ -527,7 +528,7 @@ class Editor extends PureComponent {
 
     if (
       !selectedSource ||
-      selectedSource.get("loading") ||
+      !isLoaded(selectedSource.toJS()) ||
       !hitCount ||
       !this.state.editor
     ) {