maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

fixing accessibility for time filter button (#43891)

Browse source 
* fixing accessibility for time filter button

* updating storyshots

* fixing string concatenation
This commit is contained in:
Tim Schnell 2019-08-26 13:30:20 -05:00 committed by GitHub
parent d859b79a98
commit b49192626a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
x-pack/legacy/plugins/canvas/canvas_plugin_src/renderers/time_filter/components/time_filter/__examples__/__snapshots__/time_filter.examples.storyshot generated
View file

@ -15,6 +15,7 @@ exports[`Storyshots renderers/TimeFilter compact mode 1`] = `
className="euiPopover__anchor canvasTimePickerPopover__anchor"
>
<button
aria-label="Displaying data Last 7 days. Click to open a calendar tool to select a new time range."
className="canvasTimePickerPopover__button"
onClick={[Function]}
>

1
x-pack/legacy/plugins/canvas/canvas_plugin_src/renderers/time_filter/components/time_picker_popover/__examples__/__snapshots__/time_picker_popover.examples.storyshot generated
View file

@ -15,6 +15,7 @@ exports[`Storyshots renderers/TimeFilter/components/TimePickerPopover default 1`
className="euiPopover__anchor canvasTimePickerPopover__anchor"
>
<button
aria-label="Displaying data ~ a month ago to ~ in 3 days. Click to open a calendar tool to select a new time range."
className="canvasTimePickerPopover__button"
onClick={[Function]}
>

10
x-pack/legacy/plugins/canvas/canvas_plugin_src/renderers/time_filter/components/time_picker_popover/time_picker_popover.tsx
View file

@ -9,6 +9,7 @@ import PropTypes from 'prop-types';
// @ts-ignore untyped local
import { Popover } from '../../../../../public/components/popover';
import { PrettyDuration } from '../pretty_duration';
import { formatDuration } from '../pretty_duration/lib/format_duration';
import { TimePicker } from '../time_picker';
export interface Props {
@ -22,7 +23,14 @@ export interface Props {
export const TimePickerPopover: FunctionComponent<Props> = ({ from, to, onSelect }) => {
const button = (handleClick: (event: MouseEvent<HTMLButtonElement>) => void) => (
<button className="canvasTimePickerPopover__button" onClick={handleClick}>
<button
className="canvasTimePickerPopover__button"
aria-label={`Displaying data ${formatDuration(
from,
to
)}. Click to open a calendar tool to select a new time range.`}
onClick={handleClick}
>
<PrettyDuration from={from} to={to} />
</button>
);