Как выполнить метатег и титульный тест в React для реагирующего шлема?

Question

Как сделать юнит-тест в ферменте для проверки <title> а также <meta /> существует и его содержание?

index.test.js

describe('<Helmet />', () => {
  it('should render an <Helmet> tag', () => {
    let wrapper = mount(
      <IntlProvider locale='en'>
        <ThemeProvider theme={theme}>
          <Helmet />
        </ThemeProvider>
      </IntlProvider>
    );
    console.log(wrapper.find('title').length);
    // expect(document.title).to.equal('My page title);
  });
});

index.js

const App = ({ intl }) => {
  const domain = window.location.hostname;
  return (
    <div>
      <Helmet>
        <title>My page title</title>
        <meta name="title" content="meta content" />
        <meta name="description" content="meta description" />
        <meta property="og:title" content="meta title for fb" />
        <meta property="og:description" content="meta description for fb" />
        <meta property="og:url" content={`https://${domain}/`} />
      </Helmet>

      <CookiesProvider>
        <Switch>
          <Route exact path="/" component={Home} />
          <Route component={NotFoundPage} />
        </Switch>
      </CookiesProvider>
    </div>
  );
};

Answer 1

Всегда есть шанс shallow тестирование точного компонента:

export const App = ({ intl }) => {
  const domain = window.location.hostname;
  return (
    <div>
      <Helmet>
        <title>My page title</title>
        <meta name="title" content="meta content" />
        <meta name="description" content="meta description" />
        <meta property="og:title" content="meta title for fb" />
        <meta property="og:description" content="meta description for fb" />
        <meta property="og:url" content={`https://${domain}/`} />
      </Helmet>
    </div>
  );
};

Тестовый код:

it("<meta> and <title> exists with proper content", () => {
  const wrapper = shallow(<App />);

  const title = "My page title";
  const metaTitleContent = "meta content";
  const metaDescriptionContent = "meta description";

  expect(wrapper.find("title").text()).toBe(title);
  expect(document.title).toBe(title);

  expect(
    wrapper.find("meta[name='title']").props().content)
  .toBe(metaTitleContent);

  expect(
    wrapper.find("meta[name='description']").props().content)
  .toBe(metaDescriptionContent);
});