在React中如何对React头盔进行元标记和标题单元测试?

时间:2018-06-22 17:18:12

标签: javascript reactjs unit-testing enzyme react-helmet

如何在中进行单元测试以检查<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>
  );
};

1 个答案:

答案 0 :(得分:2)

[1] "Quantum Chemistry;Electronic Structure;Condensed Matter Physics;Materials Science;Nanotechnology" [2] "density functional theory;first principles calculations;many body theory;condensed matter physics;materials science" [3] "chemistry;materials science;physics;nanotechnology" [4] "Materials Science;Nanotechnology;Chemistry;Physics" [5] "Physics;Theoretical Physics;Condensed Matter Theory;Materials Science;Nanoscience" [6] "Materials Science;Quantum Chemistry;Fiber Optic Sensors;Geophysics" [7] "Chemical Physics;Condensed Matter;Materials Science;Magnetic Properties;NMR" [8] "Materials Science" [9] "Materials Science;Physics" [10] "Physics;Materials Science;Theoretical Physics;Nanoscience" 中总是有机会测试确切的组件:

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>
  );
};

Edit 7m8n2wkxpx