tor-browser

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

DSContextFooter.test.jsx (4367B)

      1 import {
      2  DSContextFooter,
      3  StatusMessage,
      4  DSMessageFooter,
      5 } from "content-src/components/DiscoveryStreamComponents/DSContextFooter/DSContextFooter";
      6 import React from "react";
      7 import { mount } from "enzyme";
      8 import { cardContextTypes } from "content-src/components/Card/types.mjs";
      9 import { FluentOrText } from "content-src/components/FluentOrText/FluentOrText.jsx";
     10 
     11 describe("<DSContextFooter>", () => {
     12  let wrapper;
     13  let sandbox;
     14  const bookmarkBadge = "bookmark";
     15  const removeBookmarkBadge = "removedBookmark";
     16  // eslint-disable-next-line no-shadow
     17  const context = "Sponsored by Babel";
     18  const sponsored_by_override = "Sponsored override";
     19  const engagement = "Popular";
     20 
     21  beforeEach(() => {
     22    wrapper = mount(<DSContextFooter />);
     23    sandbox = sinon.createSandbox();
     24  });
     25 
     26  afterEach(() => {
     27    sandbox.restore();
     28  });
     29 
     30  it("should render", () => assert.isTrue(wrapper.exists()));
     31  it("should not render an engagement status if display_engagement_labels is false", () => {
     32    wrapper = mount(
     33      <DSContextFooter
     34        display_engagement_labels={false}
     35        engagement={engagement}
     36      />
     37    );
     38 
     39    const engagementLabel = wrapper.find(".story-view-count");
     40    assert.equal(engagementLabel.length, 0);
     41  });
     42  it("should render a badge if a proper badge prop is passed", () => {
     43    wrapper = mount(
     44      <DSContextFooter context_type={bookmarkBadge} engagement={engagement} />
     45    );
     46    const { fluentID } = cardContextTypes[bookmarkBadge];
     47 
     48    assert.lengthOf(wrapper.find(".story-view-count"), 0);
     49    const statusLabel = wrapper.find(".story-context-label");
     50    assert.equal(statusLabel.prop("data-l10n-id"), fluentID);
     51  });
     52  it("should only render a sponsored context if pass a sponsored context", async () => {
     53    wrapper = mount(
     54      <DSContextFooter
     55        context_type={bookmarkBadge}
     56        context={context}
     57        engagement={engagement}
     58      />
     59    );
     60 
     61    assert.lengthOf(wrapper.find(".story-view-count"), 0);
     62    assert.lengthOf(wrapper.find(StatusMessage), 0);
     63    assert.equal(wrapper.find(".story-sponsored-label").text(), context);
     64  });
     65  it("should render a sponsored_by_override if passed a sponsored_by_override", async () => {
     66    wrapper = mount(
     67      <DSContextFooter
     68        context_type={bookmarkBadge}
     69        context={context}
     70        sponsored_by_override={sponsored_by_override}
     71        engagement={engagement}
     72      />
     73    );
     74 
     75    assert.equal(
     76      wrapper.find(".story-sponsored-label").text(),
     77      sponsored_by_override
     78    );
     79  });
     80  it("should render nothing with a sponsored_by_override empty string", async () => {
     81    wrapper = mount(
     82      <DSContextFooter
     83        context_type={bookmarkBadge}
     84        context={context}
     85        sponsored_by_override=""
     86        engagement={engagement}
     87      />
     88    );
     89 
     90    assert.isFalse(wrapper.find(".story-sponsored-label").exists());
     91  });
     92  it("should render localized string with sponsor with no sponsored_by_override", async () => {
     93    wrapper = mount(
     94      <DSContextFooter
     95        context_type={bookmarkBadge}
     96        context={context}
     97        sponsor="Nimoy"
     98        engagement={engagement}
     99      />
    100    );
    101 
    102    assert.equal(
    103      wrapper.find(".story-sponsored-label").children().at(0).type(),
    104      FluentOrText
    105    );
    106  });
    107  it("should render a new badge if props change from an old badge to a new one", async () => {
    108    wrapper = mount(<DSContextFooter context_type={bookmarkBadge} />);
    109 
    110    const { fluentID: bookmarkFluentID } = cardContextTypes[bookmarkBadge];
    111    const bookmarkStatusMessage = wrapper.find(
    112      `div[data-l10n-id='${bookmarkFluentID}']`
    113    );
    114    assert.isTrue(bookmarkStatusMessage.exists());
    115 
    116    const { fluentID: removeBookmarkFluentID } =
    117      cardContextTypes[removeBookmarkBadge];
    118 
    119    wrapper.setProps({ context_type: removeBookmarkBadge });
    120    await wrapper.update();
    121 
    122    assert.isEmpty(bookmarkStatusMessage);
    123    const removedBookmarkStatusMessage = wrapper.find(
    124      `div[data-l10n-id='${removeBookmarkFluentID}']`
    125    );
    126    assert.isTrue(removedBookmarkStatusMessage.exists());
    127  });
    128  it("should render a story footer", () => {
    129    wrapper = mount(
    130      <DSMessageFooter
    131        context_type={bookmarkBadge}
    132        engagement={engagement}
    133        display_engagement_labels={true}
    134      />
    135    );
    136 
    137    assert.lengthOf(wrapper.find(".story-footer"), 1);
    138  });
    139 });