Updating index page tests to use react-testing-library

This commit is contained in:
Jeff Avallone 2019-03-24 12:57:53 -04:00
parent d813fdf742
commit 58dc36b0c6
2 changed files with 60 additions and 81 deletions

View File

@ -1,89 +1,61 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Index Page rendering 1`] = `
<Fragment>
<withI18nextTranslation(Metadata)
description="Test description"
<DocumentFragment>
<span
data-component="withI18nextTranslation(Metadata)"
data-props="{
\\"description\\": \\"Test description\\"
}"
/>
<noscript>
<Message
heading="JavaScript Required"
type="error"
>
<p>
You need JavaScript to use Regexper.
</p>
<p>
If you have concerns regarding the use of tracking code on Regexper, please see the
<mockConstructor
to="/privacy"
>
Privacy Policy
</mockConstructor>
.
</p>
</Message>
</noscript>
<withI18nextTranslation(App)
expr=""
permalinkUrl={null}
syntax="testJs"
syntaxList={
Array [
Object {
"id": "testJS",
"name": "Testing JS",
},
Object {
"id": "other",
"name": "Other",
},
]
<noscript />
<span
data-component="withI18nextTranslation(App)"
data-props="{
\\"syntaxList\\": [
{
\\"id\\": \\"testJS\\",
\\"name\\": \\"Testing JS\\"
},
{
\\"id\\": \\"other\\",
\\"name\\": \\"Other\\"
}
],
\\"syntax\\": \\"testJs\\",
\\"expr\\": \\"\\",
\\"permalinkUrl\\": null
}"
/>
</Fragment>
</DocumentFragment>
`;
exports[`Index Page rendering with an expression on the URL 1`] = `
<Fragment>
<withI18nextTranslation(Metadata)
description="Test description"
<DocumentFragment>
<span
data-component="withI18nextTranslation(Metadata)"
data-props="{
\\"description\\": \\"Test description\\"
}"
/>
<noscript>
<Message
heading="JavaScript Required"
type="error"
>
<p>
You need JavaScript to use Regexper.
</p>
<p>
If you have concerns regarding the use of tracking code on Regexper, please see the
<mockConstructor
to="/privacy"
>
Privacy Policy
</mockConstructor>
.
</p>
</Message>
</noscript>
<withI18nextTranslation(App)
expr="testing"
permalinkUrl="http://example.com"
syntax="test"
syntaxList={
Array [
Object {
"id": "testJS",
"name": "Testing JS",
},
Object {
"id": "other",
"name": "Other",
},
]
<noscript />
<span
data-component="withI18nextTranslation(App)"
data-props="{
\\"syntaxList\\": [
{
\\"id\\": \\"testJS\\",
\\"name\\": \\"Testing JS\\"
},
{
\\"id\\": \\"other\\",
\\"name\\": \\"Other\\"
}
],
\\"syntax\\": \\"test\\",
\\"expr\\": \\"testing\\",
\\"permalinkUrl\\": \\"http://example.com\\"
}"
/>
</Fragment>
</DocumentFragment>
`;

View File

@ -1,5 +1,12 @@
jest.mock('components/Metadata', () =>
require('__mocks__/component-mock')('components/Metadata'));
jest.mock('components/Message', () =>
require('__mocks__/component-mock')('components/Message'));
jest.mock('components/App', () =>
require('__mocks__/component-mock')('components/App'));
import React from 'react';
import { shallow } from 'enzyme';
import { render } from 'react-testing-library';
import { IndexPage } from 'pages/index';
@ -18,19 +25,19 @@ const queryResult = {
describe('Index Page', () => {
test('rendering', () => {
const component = shallow(
const { asFragment } = render(
<IndexPage location={{ hash: '' }} data={ queryResult } />
);
expect(component).toMatchSnapshot();
expect(asFragment()).toMatchSnapshot();
});
test('rendering with an expression on the URL', () => {
const component = shallow(
const { asFragment } = render(
<IndexPage location={{
hash: '#syntax=test&expr=testing',
href: 'http://example.com'
}} data={ queryResult } />
);
expect(component).toMatchSnapshot();
expect(asFragment()).toMatchSnapshot();
});
});