Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integrate with a CSS parser for selector parsing #1086

Merged
merged 25 commits into from
Sep 16, 2017
Merged

Integrate with a CSS parser for selector parsing #1086

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
8177e26
Implement new selector parsing module
Aug 21, 2017
0d4a7eb
Use new selector API in mount and shallow wrappers
Aug 21, 2017
51ff0e7
Implement findParentNode utility
Aug 21, 2017
26bf200
Rename selector tests file
Aug 21, 2017
fa80c0e
Stop treating unquoted strings as invalid
Aug 21, 2017
b18cfe4
Update tests
Aug 21, 2017
5dde9c6
Add more comments to selectors.js
Aug 21, 2017
f20b0c4
Linting fixes
Aug 21, 2017
d7abfbe
Remove ComplexSelector
Aug 21, 2017
8bffb8a
Remove old predicate/selector parsing utilities
Aug 21, 2017
10019da
Remove invalid attribute test
Aug 21, 2017
5efaf08
Throw an error for complex selectors in buildPredicate
Aug 21, 2017
83c6f04
Move combinator logic into discrete utility functions
Aug 21, 2017
8b3e008
Replace scalpel with new rst-selector-parser package
Aug 22, 2017
1a73724
Throw for pseudo-class and psuedo-element selectors
Aug 23, 2017
36e10d2
Add more tests for selectors
Aug 23, 2017
ae733ee
Add test for URLS in attribute values
Aug 25, 2017
60b6a86
Improve test coverage, use correct APIs
Sep 1, 2017
2c3227b
Remove uuid from enzyme package.json
Sep 1, 2017
d0d810e
Fix error type in selector assertion
Sep 1, 2017
459108a
Fix react prop test assertion
Sep 1, 2017
188ed1c
Use if/else for branching in selector predicate functions
Sep 1, 2017
17f366d
Add nodeHasProperty test for NaN and Infinity
Sep 13, 2017
aadbc4a
Add test for adjacent siblings in arrays
Sep 13, 2017
a79e150
Use _reactInternalFiber for 16 adapater
Sep 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Improve test coverage, use correct APIs
  • Loading branch information
Brandon Dail committed Sep 13, 2017
commit 60b6a86eba01549b83f4ee1ac8d7ef5480b2fe14
18 changes: 14 additions & 4 deletions packages/enzyme-test-suite/test/RSTTraversal-spec.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,10 +68,13 @@ describe('RSTTraversal', () => {
expect(nodeHasProperty(node, 'title')).to.equal(false);
});

it('should parse false', () => {
const node = $(<div foo={false} />);

expect(nodeHasProperty(node, 'foo', false)).to.equal(true);
it('should parse booleans', () => {
expect(nodeHasProperty(<div foo />, 'foo', true)).to.equal(true);
expect(nodeHasProperty(<div foo />, 'foo', false)).to.equal(false);
expect(nodeHasProperty(<div foo />, 'foo', 'true')).to.equal(false);
expect(nodeHasProperty(<div foo={false} />, 'foo', false)).to.equal(true);
expect(nodeHasProperty(<div foo={false} />, 'foo', true)).to.equal(false);
expect(nodeHasProperty(<div foo={false} />, 'foo', 'false')).to.equal(false);
});

it('should parse numeric literals', () => {
Expand All @@ -89,11 +92,14 @@ describe('RSTTraversal', () => {
expect(nodeHasProperty(<div foo={0} />, 'foo', 0)).to.equal(true);
expect(nodeHasProperty(<div foo={0} />, 'foo', +0)).to.equal(true);
expect(nodeHasProperty(<div foo={-0} />, 'foo', -0)).to.equal(true);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can we add test cases that -0 does not match 0, and 0 does not match -0?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

expect(nodeHasProperty(<div foo={-0} />, 'foo', 0)).to.equal(false);
expect(nodeHasProperty(<div foo={0} />, 'foo', -0)).to.equal(false);
expect(nodeHasProperty(<div foo={1} />, 'foo', 0)).to.equal(false);
expect(nodeHasProperty(<div foo={2} />, 'foo', -0)).to.equal(false);
});

it('should work with empty strings', () => {
expect(nodeHasProperty(<div foo="" />, 'foo', '')).to.equal(true);
expect(nodeHasProperty(<div foo={''} />, 'foo', '')).to.equal(true);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for funsies, let's add foo="" also?

expect(nodeHasProperty(<div foo={'bar'} />, 'foo', '')).to.equal(false);
});
Expand All @@ -116,9 +122,13 @@ describe('RSTTraversal', () => {
it('should work with ±Infinity', () => {
expect(nodeHasProperty(<div foo={Infinity} />, 'foo', Infinity)).to.equal(true);
expect(nodeHasProperty(<div foo={Infinity} />, 'foo', +Infinity)).to.equal(true);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let's add a case where Infinity fails to match a prop value of Infinity?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It'd also be good to ensure NaN and Infinity don't equate, since both are not finite

expect(nodeHasProperty(<div foo={Infinity} />, 'foo', -Infinity)).to.equal(false);
expect(nodeHasProperty(<div foo={Infinity} />, 'foo', 'Infinity')).to.equal(false);
expect(nodeHasProperty(<div foo={0} />, 'foo', Infinity)).to.equal(false);
expect(nodeHasProperty(<div foo={-Infinity} />, 'foo', -Infinity)).to.equal(true);
expect(nodeHasProperty(<div foo={-Infinity} />, 'foo', Infinity)).to.equal(false);
expect(nodeHasProperty(<div foo={-Infinity} />, 'foo', Infinity)).to.equal(false);
expect(nodeHasProperty(<div foo={-Infinity} />, 'foo', '-Infinity')).to.equal(false);
expect(nodeHasProperty(<div foo={0} />, 'foo', -Infinity)).to.equal(false);
});
});
Expand Down
15 changes: 12 additions & 3 deletions packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -486,9 +486,18 @@ describeWithDOM('mount', () => {
<input type="text" />
</div>,
);
expect(() => wrapper.find('[type=text]')).to.throw();
expect(() => wrapper.find('[type=hidden]')).to.throw();
expect(() => wrapper.find('[type="text"]')).to.not.throw();
expect(() => wrapper.find('[type=text]')).to.throw(
Error,
'Failed to parse selector: [type=text]',
);
expect(() => wrapper.find('[type=hidden]')).to.throw(
Error,
'Failed to parse selector: [type=hidden]',
);
expect(() => wrapper.find('[type="text"]')).to.not.throw(
Error,
'Failed to parse selector: [type="text"]',
);
});

it('should support data prop selectors', () => {
Expand Down
15 changes: 12 additions & 3 deletions packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -569,9 +569,18 @@ describe('shallow', () => {
<input type="text" />
</div>,
);
expect(() => wrapper.find('[type=text]')).to.throw();
expect(() => wrapper.find('[type=hidden]')).to.throw();
expect(() => wrapper.find('[type="text"]')).to.not.throw();
expect(() => wrapper.find('[type=text]')).to.throw(
Error,
'Failed to parse selector: [type=text]',
);
expect(() => wrapper.find('[type=hidden]')).to.throw(
Error,
'Failed to parse selector: [type=hidden]',
);
expect(() => wrapper.find('[type="text"]')).to.not.throw(
Error,
'Failed to parse selector: [type="text"]',
);
});

it('should compound tag and prop selector', () => {
Expand Down
79 changes: 40 additions & 39 deletions packages/enzyme-test-suite/test/selector-spec.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('span').length).to.equal(2);
expect(wrapper.find('.top-div span').length).to.equal(1);
expect(wrapper.find('span')).to.have.lengthOf(2);
expect(wrapper.find('.top-div span')).to.have.lengthOf(1);
});

it('nested descendent', () => {
Expand All @@ -55,8 +55,8 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('h1').length).to.equal(3);
expect(wrapper.find('.my-div h1').length).to.equal(2);
expect(wrapper.find('h1')).to.have.lengthOf(3);
expect(wrapper.find('.my-div h1')).to.have.lengthOf(2);
});

it('deep descendent', () => {
Expand All @@ -75,8 +75,8 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('h1').length).to.equal(2);
expect(wrapper.find('div .inner span .way-inner h1').length).to.equal(1);
expect(wrapper.find('h1')).to.have.lengthOf(2);
expect(wrapper.find('div .inner span .way-inner h1')).to.have.lengthOf(1);
});

it('direct descendent', () => {
Expand All @@ -92,9 +92,9 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('.to-find').length).to.equal(3);
expect(wrapper.find('.to-find')).to.have.lengthOf(3);
const descendent = wrapper.find('.container > .to-find');
expect(descendent.length).to.equal(1);
expect(descendent).to.have.lengthOf(1);
expect(descendent.text()).to.equal('Direct');
});

Expand All @@ -107,9 +107,9 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('.sibling').length).to.equal(2);
expect(wrapper.find('.sibling')).to.have.lengthOf(2);
const toFind = wrapper.find('.to-find + .sibling');
expect(toFind.length).to.equal(1);
expect(toFind).to.have.lengthOf(1);
expect(toFind.text()).to.equal('Adjacent');
});

Expand All @@ -129,9 +129,9 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('.to-find').length).to.equal(3);
expect(wrapper.find('.to-find')).to.have.lengthOf(3);
const toFind = wrapper.find('.to-find + .sibling');
expect(toFind.length).to.equal(2);
expect(toFind).to.have.lengthOf(2);
toFind.map(found => expect(found.text()).to.equal('Adjacent'));
});

Expand All @@ -148,7 +148,7 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('.to-find ~ span').length).to.equal(3);
expect(wrapper.find('.to-find ~ span')).to.have.lengthOf(3);
});

it('nested general siblings', () => {
Expand Down Expand Up @@ -177,6 +177,7 @@ describe('selectors', () => {
const wrapper = renderMethod(<div className="foo" />);
['is', 'filter', 'not', 'every'].forEach((method) => {
expect(() => wrapper[method]('.foo + div')).to.throw(
Error,
'This method does not support complex CSS selectors',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

similarly, can all these assert on both type and message?

);
});
Expand Down Expand Up @@ -209,7 +210,7 @@ describe('selectors', () => {
</div>,
);

expect(wrapper.find('.foo + div > span').length).to.equal(1);
expect(wrapper.find('.foo + div > span')).to.have.lengthOf(1);
});

it('.foo + .foo + .foo', () => {
Expand All @@ -220,10 +221,10 @@ describe('selectors', () => {
<div className="foo">foo3</div>
</div>,
);
expect(wrapper.find('.foo + .foo').length).to.equal(2);
expect(wrapper.find('.foo + .foo')).to.have.lengthOf(2);
expect(wrapper.find('.foo + .foo').at(0).text()).to.equal('foo2');
expect(wrapper.find('.foo + .foo').at(1).text()).to.equal('foo3');
expect(wrapper.find('.foo + .foo + .foo').length).to.equal(1);
expect(wrapper.find('.foo + .foo + .foo')).to.have.lengthOf(1);
});

it('attribute names with numbers', () => {
Expand All @@ -235,10 +236,10 @@ describe('selectors', () => {
<div data-foo-2="2" />
</div>,
);
expect(wrapper.find('[data-foo-1=1]').length).to.equal(2);
expect(wrapper.find('[data-foo-1="1"]').length).to.equal(0);
expect(wrapper.find('[data-foo-2=2]').length).to.equal(1);
expect(wrapper.find('[data-foo-2="2"]').length).to.equal(1);
expect(wrapper.find('[data-foo-1=1]')).to.have.lengthOf(2);
expect(wrapper.find('[data-foo-1="1"]')).to.have.lengthOf(0);
expect(wrapper.find('[data-foo-2=2]')).to.have.lengthOf(1);
expect(wrapper.find('[data-foo-2="2"]')).to.have.lengthOf(1);
});

it('hyphens', () => {
Expand All @@ -250,13 +251,13 @@ describe('selectors', () => {
<span className="-foo" />
</div>,
);
expect(wrapper.find('.-foo').length).to.equal(3);
expect(wrapper.find('.foo-').length).to.equal(1);
expect(wrapper.find('[type="foo"].foo-').length).to.equal(1);
expect(wrapper.find('.foo-.-bar-').length).to.equal(1);
expect(wrapper.find('div.foo-').length).to.equal(1);
expect(wrapper.find('div.-foo').length).to.equal(2);
expect(wrapper.find('#bar.-foo').length).to.equal(1);
expect(wrapper.find('.-foo')).to.have.lengthOf(3);
expect(wrapper.find('.foo-')).to.have.lengthOf(1);
expect(wrapper.find('[type="foo"].foo-')).to.have.lengthOf(1);
expect(wrapper.find('.foo-.-bar-')).to.have.lengthOf(1);
expect(wrapper.find('div.foo-')).to.have.lengthOf(1);
expect(wrapper.find('div.-foo')).to.have.lengthOf(2);
expect(wrapper.find('#bar.-foo')).to.have.lengthOf(1);
});

it('hyphens', () => {
Expand All @@ -268,13 +269,13 @@ describe('selectors', () => {
<span className="-foo" />
</div>,
);
expect(wrapper.find('.-foo').length).to.equal(3);
expect(wrapper.find('.foo-').length).to.equal(1);
expect(wrapper.find('[type="foo"].foo-').length).to.equal(1);
expect(wrapper.find('.foo-.-bar-').length).to.equal(1);
expect(wrapper.find('div.foo-').length).to.equal(1);
expect(wrapper.find('div.-foo').length).to.equal(2);
expect(wrapper.find('#bar.-foo').length).to.equal(1);
expect(wrapper.find('.-foo')).to.have.lengthOf(3);
expect(wrapper.find('.foo-')).to.have.lengthOf(1);
expect(wrapper.find('[type="foo"].foo-')).to.have.lengthOf(1);
expect(wrapper.find('.foo-.-bar-')).to.have.lengthOf(1);
expect(wrapper.find('div.foo-')).to.have.lengthOf(1);
expect(wrapper.find('div.-foo')).to.have.lengthOf(2);
expect(wrapper.find('#bar.-foo')).to.have.lengthOf(1);
});

it('spaces in attribute values', () => {
Expand All @@ -285,7 +286,7 @@ describe('selectors', () => {
<div type="foobar" />
</div>,
);
expect(wrapper.find('[type="foo bar"]').length).to.equal(1);
expect(wrapper.find('[type="foo bar"]')).to.have.lengthOf(1);
});

it('dots in attribute values', () => {
Expand All @@ -296,7 +297,7 @@ describe('selectors', () => {
<div type="foobar" />
</div>,
);
expect(wrapper.find('[type="foo.bar"]').length).to.equal(1);
expect(wrapper.find('[type="foo.bar"]')).to.have.lengthOf(1);
});

it('brackets in attribute values', () => {
Expand All @@ -305,7 +306,7 @@ describe('selectors', () => {
<div type="foo[1]" />
</div>,
);
expect(wrapper.find('[type="foo[1]"]').length).to.equal(1);
expect(wrapper.find('[type="foo[1]"]')).to.have.lengthOf(1);
});

it('URLs in attribute values', () => {
Expand All @@ -315,8 +316,8 @@ describe('selectors', () => {
<a href="foo.com" />
</div>,
);
expect(wrapper.find('a[href="https://www.foo.com"]').length).to.equal(1);
expect(wrapper.find('a[href="foo.com"]').length).to.equal(1);
expect(wrapper.find('a[href="https://www.foo.com"]')).to.have.lengthOf(1);
expect(wrapper.find('a[href="foo.com"]')).to.have.lengthOf(1);
});
});
});
Expand Down