Add Date Picker Example for Issue 34 #839
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jongund
changed the title
jongund
changed the title
mcking65
changed the title
mcking65
added a commit
that referenced
this pull request
May 26, 2020
* Add Initial Cut of Date Picker Example (pull #839) For issue #34, add a directory for datepicker examples and a first cut of code. * Date Picker Example: Add link to development issue * updated datepicker example and documentation * fixed broken reference * made updates to the documentation * made updates to the documentation * made updates to the documentation * made updated code * updated example * updated code * fixed problem with document clicks when date picker is open * fixed problem with document clicks when date picker is open * updated month year title * improved source code documentation * focus returns to textbox and added Home and End key commands for first and last day of the week * edited description of example * updated documentation * updated documentation * updated documentation * fixed some bugs * fixed some bugs * removed some debugging code * validated js and css code * fixed bug * added two regression tests * updated keyboard behavior for opeing the datepicker * updated date picker example to support keyboard announcements * updated date picker example to support keyboard announcements * updated date picker example to support keyboard announcements * added down arrow key * fixe bug with onclick * updated click event on date to put date in textbox and close dialog * down arrow appears on input focus * updated click behaviors for input and calendar button * updated datepicker document click event to handle clicking in textbox * updated datepicker document click event to handle clicking in textbox * updated code for down arrow in textbox * updated example CSS * updated code for down arrow in textbox * fixed bug with document click event for dialog * fixed interation bugs and added accessibilty feature description * updated documentation, fied bugs and added a menu button date picker * fixing mouse interaction issues * fixed mouse bugs with date picker example * cleaning up some of the code * added feature to move to the next or previosu month when clicking on a disabled date * changed header cells from using aria-label to abbr attribute * fixed bugs with buttons for changing the next/previous year and month buttons * fixed bug with next/previous buttons when focus is in the textbox * created intial example of menu button for opening date picker * added a file to support spin buttons * initial implementation of a datepicker using spin buttons * added documenation about values wrapping for day and month * added documenation about values wrapping for day and month * button label is updated with current date information * button label is updated with current date information for combobox too now * Move spinbutton and combobox examples Moved the combobox datepicker to the aria 1.1 combobox directory. Move the spinbutton date picker to new branch issue125-spinbutton-datepicker-example. * Remove files copied to new issue1046-datepicker-dialog branch * updating example to be compatible with date gird used in dialog date picker example * fixed css bug * added message live region to dialog * fixed some bugs related to messages * updated documentation on live regions * updated regression test file for noew location of example and added a few tests for combobox * removed aria-controls from buttons in the dialog to change the month/year and updated the file names to be compatible with other combox file names * test commit * test commit 2 * updated date picker code to use the Date object like the datepicker dialog example * improved code by adding helper functions and removing a redundant function * updated file name to be consistent wih other examples * restored previous file name for compatibility with ava testing * improved code readibility by using helper function to test if same month * removed some unused variables * removed unused properties and used helper function to compare days * updated docuemntation and added ids for developing regression tests * started integration of dialog box regression tests * button label now updates with the selected date information * updated link to provide feedback to point to th epull request * removed aria-expanded from button * updated method names to be more consistent and descriptive * updated documentation * updated documentation * updated documentation * updated documentation * updated properties to move role and arai-expanded to input box, changed aria-owns to aria-controls and removed disabled days form the date grid * updated some of the tests * updated tests and fixe a tabindex bug * removed some unused code * removed unused functions * updated CSS for hding disabled dates * fixed data-date attribute computation * fixed html validation bugs * fixed some bugs * restored * restored * restored * updated test cases * Change version in title and footer from 1.1 to 1.2 * changes file name * updated code * fixed bug with last row being shown * added updating button label based on selected date * This test is no longer needed * changed design to remove buttons from gridcells * Added role gridcell to support validator bug for not recognizig `td` in contect of a `role=grid` as a `gridcell` * improved high contrast of combobox buton svg image * added role=groidcell to pass html validator * fixed bug with aria-selected * fixed bug with aria-select following focus * separated space and enter behavior and fixed bug with focus on combobox when page loads * Updated links to source files * Fixed broken link * updated tests and added keyboard event for button * updated test using the SPACE key * updated focus styling * Apply editorial suggestions from code review by @carmacleod Co-Authored-By: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com> * updated focus styling to use solid borders * updated styling of date with tabindex=0 * updated regression tests coverage to inlcude missing tests * removed reference to undefined object * Add missing data-test-id for tabindex=-1 * Add test for month-year-button-space-return * removed code to update button with the current date * Fix an assertion in the month-year-button-space-return test * Use await where appropriate Tests were sometimes passing and sometimes failing in CI. I think the reason may be that the code wasn't using await consistently. * fixed regression test to use Key.SPACE instead of space character * made improvements to high contrast support * updating regression tests * updated regression test to use queryElements and remove t.plan, but getting rejected promise errors * updated documentation on high contrast support * updated documentation on high contrast support * updated documentation on high contrast support * updated documentation on high contrast support * Fix tests to use queryElements correctly * Fix spelling errors caught by npm run lint:spelling * Add stubs for missing tests * removed code for an unused live region for a combobox message Co-authored-by: Matt King <a11yThinker@gmail.com> Co-authored-by: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com> Co-authored-by: Simon Pieters <zcorpan@gmail.com>
mcking65
added a commit
that referenced
this pull request
Jul 1, 2020
* Add Initial Cut of Date Picker Example (pull #839) For issue #34, add a directory for datepicker examples and a first cut of code. * Date Picker Example: Add link to development issue * updated datepicker example and documentation * fixed broken reference * made updates to the documentation * made updates to the documentation * made updates to the documentation * made updated code * updated example * updated code * fixed problem with document clicks when date picker is open * fixed problem with document clicks when date picker is open * updated month year title * improved source code documentation * focus returns to textbox and added Home and End key commands for first and last day of the week * edited description of example * updated documentation * updated documentation * updated documentation * fixed some bugs * fixed some bugs * removed some debugging code * validated js and css code * fixed bug * added two regression tests * updated keyboard behavior for opeing the datepicker * updated date picker example to support keyboard announcements * updated date picker example to support keyboard announcements * updated date picker example to support keyboard announcements * added down arrow key * fixe bug with onclick * updated click event on date to put date in textbox and close dialog * down arrow appears on input focus * updated click behaviors for input and calendar button * updated datepicker document click event to handle clicking in textbox * updated datepicker document click event to handle clicking in textbox * updated code for down arrow in textbox * updated example CSS * updated code for down arrow in textbox * fixed bug with document click event for dialog * fixed interation bugs and added accessibilty feature description * updated documentation, fied bugs and added a menu button date picker * fixing mouse interaction issues * fixed mouse bugs with date picker example * cleaning up some of the code * added feature to move to the next or previosu month when clicking on a disabled date * changed header cells from using aria-label to abbr attribute * fixed bugs with buttons for changing the next/previous year and month buttons * fixed bug with next/previous buttons when focus is in the textbox * created intial example of menu button for opening date picker * added a file to support spin buttons * initial implementation of a datepicker using spin buttons * added documenation about values wrapping for day and month * added documenation about values wrapping for day and month * button label is updated with current date information * button label is updated with current date information for combobox too now * Move spinbutton and combobox examples Moved the combobox datepicker to the aria 1.1 combobox directory. Move the spinbutton date picker to new branch issue125-spinbutton-datepicker-example. * Remove files copied to new issue1046-datepicker-dialog branch * updating example to be compatible with date gird used in dialog date picker example * fixed css bug * added message live region to dialog * fixed some bugs related to messages * updated documentation on live regions * updated regression test file for noew location of example and added a few tests for combobox * removed aria-controls from buttons in the dialog to change the month/year and updated the file names to be compatible with other combox file names * test commit * test commit 2 * updated date picker code to use the Date object like the datepicker dialog example * improved code by adding helper functions and removing a redundant function * updated file name to be consistent wih other examples * restored previous file name for compatibility with ava testing * improved code readibility by using helper function to test if same month * removed some unused variables * removed unused properties and used helper function to compare days * updated docuemntation and added ids for developing regression tests * started integration of dialog box regression tests * button label now updates with the selected date information * updated link to provide feedback to point to th epull request * removed aria-expanded from button * updated method names to be more consistent and descriptive * updated documentation * updated documentation * updated documentation * updated documentation * updated properties to move role and arai-expanded to input box, changed aria-owns to aria-controls and removed disabled days form the date grid * updated some of the tests * updated tests and fixe a tabindex bug * removed some unused code * removed unused functions * updated CSS for hding disabled dates * fixed data-date attribute computation * fixed html validation bugs * fixed some bugs * restored * restored * restored * updated test cases * Change version in title and footer from 1.1 to 1.2 * changes file name * updated code * fixed bug with last row being shown * added updating button label based on selected date * This test is no longer needed * changed design to remove buttons from gridcells * Added role gridcell to support validator bug for not recognizig `td` in contect of a `role=grid` as a `gridcell` * improved high contrast of combobox buton svg image * added role=groidcell to pass html validator * fixed bug with aria-selected * fixed bug with aria-select following focus * separated space and enter behavior and fixed bug with focus on combobox when page loads * Updated links to source files * Fixed broken link * updated tests and added keyboard event for button * updated test using the SPACE key * updated focus styling * Apply editorial suggestions from code review by @carmacleod Co-Authored-By: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com> * updated focus styling to use solid borders * updated styling of date with tabindex=0 * updated regression tests coverage to inlcude missing tests * removed reference to undefined object * Add missing data-test-id for tabindex=-1 * Add test for month-year-button-space-return * removed code to update button with the current date * Fix an assertion in the month-year-button-space-return test * Use await where appropriate Tests were sometimes passing and sometimes failing in CI. I think the reason may be that the code wasn't using await consistently. * fixed regression test to use Key.SPACE instead of space character * made improvements to high contrast support * updating regression tests * updated regression test to use queryElements and remove t.plan, but getting rejected promise errors * updated documentation on high contrast support * updated documentation on high contrast support * updated documentation on high contrast support * updated documentation on high contrast support * Fix tests to use queryElements correctly * Fix spelling errors caught by npm run lint:spelling * Add stubs for missing tests * removed code for an unused live region for a combobox message Co-authored-by: Matt King <a11yThinker@gmail.com> Co-authored-by: Carolyn MacLeod <Carolyn_MacLeod@ca.ibm.com> Co-authored-by: Simon Pieters <zcorpan@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
An initial implementation of a date picker combo box for issue #34.