Skip to content

Commit

Permalink
Add DOM test fixture for radio name change issue
Browse files Browse the repository at this point in the history
  • Loading branch information
nhunzaker committed Nov 7, 2017
1 parent 03b1b30 commit f18c4c4
Show file tree
Hide file tree
Showing 2 changed files with 65 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
const React = window.React;
const noop = n => n;

class RadioNameChangeFixture extends React.Component {
state = {
updated: false,
};
onClick = () => {
this.setState(state => {
return { updated: !state.updated }
});
};
render() {
const {updated} = this.state;
const radioName = updated ? 'firstName' : 'secondName';
return (
<div>
<label>
<input
type="radio"
name={radioName}
onChange={noop}
checked={updated === false}
/>
First Radio
</label>

<label>
<input
type="radio"
name={radioName}
onChange={noop}
checked={updated === true}
/>
Second Radio
</label>

<div>
<button type="button" onClick={this.onClick}>Toggle</button>
</div>
</div>
);
}
}

export default RadioNameChangeFixture
19 changes: 19 additions & 0 deletions fixtures/dom/src/components/fixtures/input-change-events/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import TestCase from '../../TestCase';
import RangeKeyboardFixture from './RangeKeyboardFixture';
import RadioClickFixture from './RadioClickFixture';
import RadioGroupFixture from './RadioGroupFixture';
import RadioNameChangeFixture from './RadioNameChangeFixture';
import InputPlaceholderFixture from './InputPlaceholderFixture';

class InputChangeEvents extends React.Component {
Expand Down Expand Up @@ -87,6 +88,24 @@ class InputChangeEvents extends React.Component {

<InputPlaceholderFixture />
</TestCase>
<TestCase
title="Radio button groups with name changes"
description={`
A radio button group should have correct checked value when
the names changes
`}
resolvedBy="#11227"
affectedBrowsers="IE9+">
<TestCase.Steps>
<li>Click the toggle button</li>
</TestCase.Steps>

<TestCase.ExpectedResult>
The checked radio button should switch between the first and second radio button
</TestCase.ExpectedResult>

<RadioNameChangeFixture />
</TestCase>
</FixtureSet>
);
}
Expand Down

0 comments on commit f18c4c4

Please sign in to comment.