tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

ErrorBoundary.test.jsx (3612B)

      1 import { A11yLinkButton } from "content-src/components/A11yLinkButton/A11yLinkButton";
      2 import {
      3  ErrorBoundary,
      4  ErrorBoundaryFallback,
      5 } from "content-src/components/ErrorBoundary/ErrorBoundary";
      6 import React from "react";
      7 import { shallow } from "enzyme";
      8 
      9 describe("<ErrorBoundary>", () => {
     10  it("should render its children if componentDidCatch wasn't called", () => {
     11    const wrapper = shallow(
     12      <ErrorBoundary>
     13        <div className="kids" />
     14      </ErrorBoundary>
     15    );
     16 
     17    assert.lengthOf(wrapper.find(".kids"), 1);
     18  });
     19 
     20  it("should render ErrorBoundaryFallback if componentDidCatch called", () => {
     21    const wrapper = shallow(<ErrorBoundary />);
     22 
     23    wrapper.instance().componentDidCatch();
     24    // since shallow wrappers don't automatically manage lifecycle semantics:
     25    wrapper.update();
     26 
     27    assert.lengthOf(wrapper.find(ErrorBoundaryFallback), 1);
     28  });
     29 
     30  it("should render the given FallbackComponent if componentDidCatch called", () => {
     31    class TestFallback extends React.PureComponent {
     32      render() {
     33        return <div className="my-fallback">doh!</div>;
     34      }
     35    }
     36 
     37    const wrapper = shallow(<ErrorBoundary FallbackComponent={TestFallback} />);
     38    wrapper.instance().componentDidCatch();
     39    // since shallow wrappers don't automatically manage lifecycle semantics:
     40    wrapper.update();
     41 
     42    assert.lengthOf(wrapper.find(TestFallback), 1);
     43  });
     44 
     45  it("should pass the given className prop to the FallbackComponent", () => {
     46    class TestFallback extends React.PureComponent {
     47      render() {
     48        return <div className={this.props.className}>doh!</div>;
     49      }
     50    }
     51 
     52    const wrapper = shallow(
     53      <ErrorBoundary FallbackComponent={TestFallback} className="sheep" />
     54    );
     55    wrapper.instance().componentDidCatch();
     56    // since shallow wrappers don't automatically manage lifecycle semantics:
     57    wrapper.update();
     58 
     59    assert.lengthOf(wrapper.find(".sheep"), 1);
     60  });
     61 });
     62 
     63 describe("ErrorBoundaryFallback", () => {
     64  it("should render a <div> with a class of as-error-fallback", () => {
     65    const wrapper = shallow(<ErrorBoundaryFallback />);
     66 
     67    assert.lengthOf(wrapper.find("div.as-error-fallback"), 1);
     68  });
     69 
     70  it("should render a <div> with the props.className and .as-error-fallback", () => {
     71    const wrapper = shallow(<ErrorBoundaryFallback className="monkeys" />);
     72 
     73    assert.lengthOf(wrapper.find("div.monkeys.as-error-fallback"), 1);
     74  });
     75 
     76  it("should call window.location.reload(true) if .reload-button clicked", () => {
     77    const fakeWindow = { location: { reload: sinon.spy() } };
     78    const wrapper = shallow(<ErrorBoundaryFallback windowObj={fakeWindow} />);
     79 
     80    wrapper.find(".reload-button").simulate("click");
     81 
     82    assert.calledOnce(fakeWindow.location.reload);
     83    assert.calledWithExactly(fakeWindow.location.reload, true);
     84  });
     85 
     86  it("should render .reload-button as an <A11yLinkButton>", () => {
     87    const wrapper = shallow(<ErrorBoundaryFallback />);
     88 
     89    assert.lengthOf(wrapper.find("A11yLinkButton.reload-button"), 1);
     90  });
     91 
     92  it("should render newtab-error-fallback-refresh-link node", () => {
     93    const wrapper = shallow(<ErrorBoundaryFallback />);
     94 
     95    const msgWrapper = wrapper.find(
     96      '[data-l10n-id="newtab-error-fallback-refresh-link"]'
     97    );
     98    assert.lengthOf(msgWrapper, 1);
     99    assert.isTrue(msgWrapper.is(A11yLinkButton));
    100  });
    101 
    102  it("should render newtab-error-fallback-info node", () => {
    103    const wrapper = shallow(<ErrorBoundaryFallback />);
    104 
    105    const msgWrapper = wrapper.find(
    106      '[data-l10n-id="newtab-error-fallback-info"]'
    107    );
    108    assert.lengthOf(msgWrapper, 1);
    109  });
    110 });