tor-browser

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

css-warning.test.js (3670B)

      1 /* Any copyright is dedicated to the Public Domain.
      2   http://creativecommons.org/publicdomain/zero/1.0/ */
      3 "use strict";
      4 
      5 // Test utils.
      6 const expect = require("expect");
      7 const { render, mount } = require("enzyme");
      8 const sinon = require("sinon");
      9 
     10 // React
     11 const {
     12  createFactory,
     13 } = require("resource://devtools/client/shared/vendor/react.mjs");
     14 const Provider = createFactory(
     15  require("resource://devtools/client/shared/vendor/react-redux.js").Provider
     16 );
     17 const {
     18  setupStore,
     19 } = require("resource://devtools/client/webconsole/test/node/helpers.js");
     20 
     21 // Components under test.
     22 const CSSWarning = require("resource://devtools/client/webconsole/components/Output/message-types/CSSWarning.js");
     23 const {
     24  MESSAGE_OPEN,
     25  MESSAGE_CLOSE,
     26 } = require("resource://devtools/client/webconsole/constants.js");
     27 
     28 // Test fakes.
     29 const {
     30  stubPreparedMessages,
     31 } = require("resource://devtools/client/webconsole/test/node/fixtures/stubs/index.js");
     32 const serviceContainer = require("resource://devtools/client/webconsole/test/node/fixtures/serviceContainer.js");
     33 
     34 describe("CSSWarning component:", () => {
     35  it("renders", () => {
     36    const message = stubPreparedMessages.get(
     37      "Unknown property ‘such-unknown-property’.  Declaration dropped."
     38    );
     39    const wrapper = render(
     40      CSSWarning({
     41        message,
     42        serviceContainer,
     43        timestampsVisible: true,
     44      })
     45    );
     46    const {
     47      timestampString,
     48    } = require("resource://devtools/client/webconsole/utils/l10n.js");
     49 
     50    expect(wrapper.find(".timestamp").text()).toBe(
     51      timestampString(message.timeStamp)
     52    );
     53 
     54    expect(wrapper.find(".message-body").text()).toBe(
     55      "Unknown property ‘such-unknown-property’.  Declaration dropped."
     56    );
     57 
     58    // There shouldn't be a matched elements label rendered by default.
     59    const elementLabel = wrapper.find(`.elements-label`);
     60    expect(elementLabel.length).toBe(0);
     61 
     62    // There should be a location.
     63    const locationLink = wrapper.find(`.message-location`);
     64    expect(locationLink.length).toBe(1);
     65    expect(locationLink.text()).toBe("test-css-message.html:3:27");
     66  });
     67 
     68  it("closes an open message when the collapse button is clicked", () => {
     69    const store = setupStore();
     70    store.dispatch = sinon.spy();
     71    const message = stubPreparedMessages.get(
     72      "Unknown property ‘such-unknown-property’.  Declaration dropped."
     73    );
     74 
     75    const wrapper = mount(
     76      Provider(
     77        { store },
     78        CSSWarning({
     79          message,
     80          open: true,
     81          dispatch: store.dispatch,
     82          serviceContainer,
     83        })
     84      )
     85    );
     86 
     87    wrapper.find(".collapse-button[aria-expanded='true']").simulate("click");
     88 
     89    const call = store.dispatch.getCall(0);
     90    expect(call.args[0]).toEqual({
     91      id: message.id,
     92      type: MESSAGE_CLOSE,
     93    });
     94  });
     95 
     96  it("opens a closed message when the collapse button is clicked", () => {
     97    const store = setupStore();
     98    store.dispatch = sinon.spy();
     99    const message = stubPreparedMessages.get(
    100      "Unknown property ‘such-unknown-property’.  Declaration dropped."
    101    );
    102 
    103    const wrapper = mount(
    104      Provider(
    105        { store },
    106        CSSWarning({
    107          message,
    108          open: false,
    109          // fake the existence of cssMatchingElements to test just MESSAGE_OPEN action
    110          cssMatchingElements: {},
    111          dispatch: store.dispatch,
    112          serviceContainer,
    113        })
    114      )
    115    );
    116 
    117    wrapper.find(".collapse-button[aria-expanded='false']").simulate("click");
    118 
    119    const call = store.dispatch.getCall(0);
    120    expect(call.args[0]).toEqual({
    121      id: message.id,
    122      type: MESSAGE_OPEN,
    123    });
    124  });
    125 });