Skip to content

Commit

Permalink
Update ReactDOMAttribute test based on attribute fixture
Browse files Browse the repository at this point in the history
**what is the change?:**
- booleans don't get stringified
- some warnings have changed since we originally wrote this

**why make this change?:**
The attribute behavior is finalized and now we can test it :D

I also found it handy to have a row with a truly unknown attribute, so
added "imaginaryFriend".

**test plan:**
`yarn test src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js`
and comparing the tests to the attribute table

**issue:**
facebook#10399
  • Loading branch information
flarnie committed Sep 2, 2017
1 parent ce03f1e commit 2fd8a5d
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 13 deletions.
1 change: 1 addition & 0 deletions fixtures/attribute-behavior/src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@ function getSVGAttribute(attributeName) {
}

const attributes = [
{name: 'imaginaryFriend', read: getAttribute('imaginaryFriend')},
{name: 'about', read: getAttribute('about')},
{name: 'aBoUt', read: getAttribute('about')},
{
Expand Down
42 changes: 29 additions & 13 deletions src/renderers/dom/shared/__tests__/ReactDOMAttribute-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,20 @@ describe('ReactDOM unknown attribute', () => {
testUnknownAttributeRemoval(undefined);
});

it('changes values true, false to null, and also warns once', () => {
spyOn(console, 'error');

testUnknownAttributeAssignment(true, null);
testUnknownAttributeAssignment(false, null);

expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toMatch(
'Warning: Received `true` for non-boolean attribute `unknown`. ' +
'If this is expected, cast the value to a string.\n' +
' in div (at **)',
);
expectDev(console.error.calls.count()).toBe(1);
});

it('removes unknown attributes that were rendered but are now missing', () => {
var el = document.createElement('div');
ReactDOM.render(<div unknown="something" />, el);
Expand All @@ -59,20 +73,18 @@ describe('ReactDOM unknown attribute', () => {
testUnknownAttributeAssignment('a string', 'a string');
});

it('coerces numbers and booleans to strings', () => {
it('coerces numbers to strings', () => {
testUnknownAttributeAssignment(0, '0');
testUnknownAttributeAssignment(-1, '-1');
testUnknownAttributeAssignment(42, '42');
testUnknownAttributeAssignment(9000.99, '9000.99');
testUnknownAttributeAssignment(true, 'true');
testUnknownAttributeAssignment(false, 'false');
});

it('coerces NaN to strings and warns', () => {
spyOn(console, 'error');

testUnknownAttributeAssignment(NaN, 'NaN');
expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toMatch(
'Warning: Received NaN for numeric attribute `unknown`. ' +
'If this is expected, cast the value to a string.\n' +
' in div (at **)',
Expand All @@ -81,8 +93,6 @@ describe('ReactDOM unknown attribute', () => {
});

it('coerces objects to strings **and warns**', () => {
spyOn(console, 'error');

const lol = {
toString() {
return 'lol';
Expand All @@ -91,26 +101,32 @@ describe('ReactDOM unknown attribute', () => {

testUnknownAttributeAssignment({hello: 'world'}, '[object Object]');
testUnknownAttributeAssignment(lol, 'lol');
// TODO: add specific expectations about what the warning says
// expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(...
expectDev(console.error.calls.count()).toBe(1);
});

it('removes symbols and warns', () => {
spyOn(console, 'error');

testUnknownAttributeRemoval(Symbol('foo'));
// TODO: add specific expectations about what the warning says
// expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(...
expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
'Warning: Invalid prop `unknown` on <div> tag. Either remove this ' +
'prop from the element, or pass a string or number value to keep it ' +
'in the DOM. For details, see https://fb.me/react-unknown-prop\n' +
' in div (at **)',
);
expectDev(console.error.calls.count()).toBe(1);
});

it('removes functions and warns', () => {
spyOn(console, 'error');

testUnknownAttributeRemoval(function someFunction() {});
// TODO: add specific expectations about what the warning says
// expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(...
expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
'Warning: Invalid prop `unknown` on <div> tag. Either remove this ' +
'prop from the element, or pass a string or number value to ' +
'keep it in the DOM. For details, see '
+ 'https://fb.me/react-unknown-prop\n'
+ ' in div (at **)',
);
expectDev(console.error.calls.count()).toBe(1);
});
});
Expand Down

0 comments on commit 2fd8a5d

Please sign in to comment.