Skip to content

Commit

Permalink
MM-16044 - Updating radio buttons (a11y) (mattermost#3085)
Browse files Browse the repository at this point in the history 
* MM-16044 - Updating radio buttons (a11y)

* Updating test
  • Loading branch information
@asaadmahmood @jwilander
asaadmahmood authored and jwilander committed Jul 11, 2019
1 parent 13003ce commit 302e776
Show file tree
Hide file tree
Showing 18 changed files with 487 additions and 507 deletions.
22 changes: 16 additions & 6 deletions components/channel_notifications_modal/components/__snapshots__/expand_view.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
inputs={
Array [
<div>
<div>
<fieldset>
<div
className="radio"
>
Expand All @@ -22,6 +22,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationGlobalDefault"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="default"
Expand All @@ -42,6 +43,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={true}
id="channelNotificationAllActivity"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="all"
Expand All @@ -61,6 +63,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationMentions"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="mention"
Expand All @@ -78,6 +81,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationNever"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="none"
Expand All @@ -88,7 +92,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
/>
</label>
</div>
</div>
</fieldset>
</div>,
]
}
Expand Down Expand Up @@ -117,7 +121,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
inputs={
Array [
<div>
<div>
<fieldset>
<div
className="radio"
>
Expand All @@ -127,6 +131,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationUnmute"
name="channelNotificationMute"
onChange={[Function]}
type="radio"
value="mention"
Expand All @@ -146,6 +151,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={true}
id="channelNotificationMute"
name="channelNotificationMute"
onChange={[Function]}
type="radio"
value="all"
Expand All @@ -156,7 +162,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
/>
</label>
</div>
</div>
</fieldset>
</div>,
]
}
Expand Down Expand Up @@ -185,7 +191,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
inputs={
Array [
<div>
<div>
<fieldset>
<div
className="radio"
>
Expand All @@ -195,6 +201,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationGlobalDefault"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="default"
Expand All @@ -215,6 +222,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={true}
id="channelNotificationAllActivity"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="all"
Expand All @@ -234,6 +242,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationMentions"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="mention"
Expand All @@ -251,6 +260,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
<input
checked={false}
id="channelNotificationNever"
name="channelDesktopNotifications"
onChange={[Function]}
type="radio"
value="none"
Expand All @@ -261,7 +271,7 @@ exports[`components/channel_notifications_modal/ExpandView should match snapshot
/>
</label>
</div>
</div>
</fieldset>
</div>,
]
}
Expand Down
20 changes: 14 additions & 6 deletions components/channel_notifications_modal/components/expand_view.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,11 +25,12 @@ export default function ExpandView({
const inputs = [(
<div key='channel-notification-level-radio'>
{(section === NotificationSections.DESKTOP || section === NotificationSections.PUSH) &&
<div>
<fieldset>
<div className='radio'>
<label className=''>
<input
id='channelNotificationGlobalDefault'
name='channelDesktopNotifications'
type='radio'
value={NotificationLevels.DEFAULT}
checked={memberNotifyLevel === NotificationLevels.DEFAULT}
Expand All @@ -46,6 +47,7 @@ export default function ExpandView({
<label className=''>
<input
id='channelNotificationAllActivity'
name='channelDesktopNotifications'
type='radio'
value={NotificationLevels.ALL}
checked={memberNotifyLevel === NotificationLevels.ALL}
Expand All @@ -61,6 +63,7 @@ export default function ExpandView({
<label className=''>
<input
id='channelNotificationMentions'
name='channelDesktopNotifications'
type='radio'
value={NotificationLevels.MENTION}
checked={memberNotifyLevel === NotificationLevels.MENTION}
Expand All @@ -76,6 +79,7 @@ export default function ExpandView({
<label>
<input
id='channelNotificationNever'
name='channelDesktopNotifications'
type='radio'
value={NotificationLevels.NONE}
checked={memberNotifyLevel === NotificationLevels.NONE}
Expand All @@ -87,14 +91,15 @@ export default function ExpandView({
/>
</label>
</div>
</div>
</fieldset>
}
{section === NotificationSections.IGNORE_CHANNEL_MENTIONS &&
<div>
<fieldset>
<div className='radio'>
<label>
<input
id='ignoreChannelMentionsOn'
name='ignoreChannelMentions'
type='radio'
value={IgnoreChannelMentions.ON}
checked={ignoreChannelMentions === IgnoreChannelMentions.ON}
Expand All @@ -112,6 +117,7 @@ export default function ExpandView({
<label>
<input
id='ignoreChannelMentionsOff'
name='ignoreChannelMentions'
type='radio'
value={IgnoreChannelMentions.OFF}
checked={ignoreChannelMentions === IgnoreChannelMentions.OFF}
Expand All @@ -125,14 +131,15 @@ export default function ExpandView({
/>
</label>
</div>
</div>
</fieldset>
}
{section === NotificationSections.MARK_UNREAD &&
<div>
<fieldset>
<div className='radio'>
<label className=''>
<input
id='channelNotificationUnmute'
name='channelNotificationMute'
type='radio'
value={NotificationLevels.MENTION}
checked={memberNotifyLevel === NotificationLevels.MENTION}
Expand All @@ -148,6 +155,7 @@ export default function ExpandView({
<label className=''>
<input
id='channelNotificationMute'
name='channelNotificationMute'
type='radio'
value={NotificationLevels.ALL}
checked={memberNotifyLevel === NotificationLevels.ALL}
Expand All @@ -159,7 +167,7 @@ export default function ExpandView({
/>
</label>
</div>
</div>
</fieldset>
}
</div>
)];
Expand Down
Loading

0 comments on commit 302e776

Please sign in to comment.