Hi all, There are some long-standing accessibility issues with input type="date". Here's a detailed and recent evaluation with a variety of browsers and assistive technologies: https://www.hassellinclusion.com/blog/input-type-date-ready-for-use/ (tl;dr Chrome and Firefox work pretty well, including with screen readers, but mobile, Edge, Safari, and Dragon all have a hard time with it). I don't have a sense for how these experiences compare to the ngb-datepicker, but we should take that into consideration.
I'm also wondering how important it is for these inputs to use the user-specified date and time formats vs. the format provided by the locale in their browser. My understanding is that type="date" always uses the browser's locale to determine the format. Otherwise, I think it is a good idea to use the built-in ones! -Jane On Tue, Aug 13, 2019 at 11:54 AM <[email protected]> wrote: > > Send Open-ils-dev mailing list submissions to > [email protected] > > To subscribe or unsubscribe via the World Wide Web, visit > http://libmail.georgialibraries.org/mailman/listinfo/open-ils-dev > or, via email, send a message with subject or body 'help' to > [email protected] > > You can reach the person managing the list at > [email protected] > > When replying, please edit your Subject line so it is more specific > than "Re: Contents of Open-ils-dev digest..." > > > Today's Topics: > > 1. Native browser date / time selectors in Angular? (Bill Erickson) > 2. Re: Native browser date / time selectors in Angular? > (Mike Rylander) > 3. Re: Native browser date / time selectors in Angular? (Dan Scott) > 4. Re: Native browser date / time selectors in Angular? > (Bill Erickson) > > > ---------------------------------------------------------------------- > > Message: 1 > Date: Tue, 13 Aug 2019 13:39:13 -0400 > From: Bill Erickson <[email protected]> > To: Public Open-ILS tech discussion > <[email protected]> > Subject: [OPEN-ILS-DEV] Native browser date / time selectors in > Angular? > Message-ID: > <CAEjrdbryzXu89N_9=ulz+l3eud3ehn2w2qdwg+o18qf7r1x...@mail.gmail.com> > Content-Type: text/plain; charset="utf-8" > > Hi All, > > For a long time, Firefox didn't support date and time <inputs/> -- no > calendar widget, no controls, etc. Because of this, we have traditionally > relied on the date / time pickers provided by the toolkit (ng-bootstrap in > Angular). > > However, Firefox does now support date [1], time [2], and datetime-local > [3] input types, as does Chrome. Date selectors provide calendar widgets, > all variations provide 'clear' actions, increment/decrement actions > (buttons and arrow key), input validation, and manual entry w/ support for > automatically jumping to the next field once a value part is entered (e.g. > hours => minutes). > > It looks like they do everything we need, but I could be overlooking > something... > > Is there any value in continuing to use the ng-bootstrap widgets for date > and time selectors? Thoughts on migrating to native browser widgets? > > -b > > [1] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date > [2] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time > [3] > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local > -------------- next part -------------- > An HTML attachment was scrubbed... > URL: > <http://libmail.georgialibraries.org/pipermail/open-ils-dev/attachments/20190813/5314c098/attachment-0001.html> > > ------------------------------ > > Message: 2 > Date: Tue, 13 Aug 2019 14:17:30 -0400 > From: Mike Rylander <[email protected]> > To: Evergreen Development Discussion List > <[email protected]> > Subject: Re: [OPEN-ILS-DEV] Native browser date / time selectors in > Angular? > Message-ID: > <CAO8ar=nGwyM20TcpFbsjhe_EbY7TVzRF9zm=0ut8o9t0fcp...@mail.gmail.com> > Content-Type: text/plain; charset="UTF-8" > > First, +1M to using the builtins! > > However, I just fired up Firefox to test empirically and I'm getting > the default text input. CanIUse > (https://caniuse.com/#search=input-date) seems to agree that FF isn't > yet there with datetime-local, sadly. > > Hopefully soon? (Or we could drop FF support... j/k, mostly.) > > Thanks for bringing it back up, in any case. > > -- > Mike Rylander > | Executive Director > | Equinox Open Library Initiative > | phone: 1-877-OPEN-ILS (673-6457) > | email: [email protected] > | web: http://equinoxinitiative.org > > On Tue, Aug 13, 2019 at 1:39 PM Bill Erickson <[email protected]> wrote: > > > > Hi All, > > > > For a long time, Firefox didn't support date and time <inputs/> -- no > > calendar widget, no controls, etc. Because of this, we have traditionally > > relied on the date / time pickers provided by the toolkit (ng-bootstrap in > > Angular). > > > > However, Firefox does now support date [1], time [2], and datetime-local > > [3] input types, as does Chrome. Date selectors provide calendar widgets, > > all variations provide 'clear' actions, increment/decrement actions > > (buttons and arrow key), input validation, and manual entry w/ support for > > automatically jumping to the next field once a value part is entered (e.g. > > hours => minutes). > > > > It looks like they do everything we need, but I could be overlooking > > something... > > > > Is there any value in continuing to use the ng-bootstrap widgets for date > > and time selectors? Thoughts on migrating to native browser widgets? > > > > -b > > > > [1] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date > > [2] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time > > [3] > > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local > > > > > ------------------------------ > > Message: 3 > Date: Tue, 13 Aug 2019 14:38:11 -0400 > From: Dan Scott <[email protected]> > To: Evergreen Development Discussion List > <[email protected]> > Subject: Re: [OPEN-ILS-DEV] Native browser date / time selectors in > Angular? > Message-ID: > <cajcovmiptef+tonw6atwdmn-uqnmn_1ri+g9bognswrgxo1...@mail.gmail.com> > Content-Type: text/plain; charset="utf-8" > > The Browser Support section agrees with caniuse.com about the lack of > support in Firefox for datetime-local: > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local#Browser_compatibility > > But date looks good and usable (per the live examples on the corresponding > MDN page). Time is functional but I'm not sure it's as friendly as the > ng-bootstrap implementation. > > On Tue, Aug 13, 2019 at 2:18 PM Mike Rylander <[email protected]> wrote: > > > First, +1M to using the builtins! > > > > However, I just fired up Firefox to test empirically and I'm getting > > the default text input. CanIUse > > (https://caniuse.com/#search=input-date) seems to agree that FF isn't > > yet there with datetime-local, sadly. > > > > Hopefully soon? (Or we could drop FF support... j/k, mostly.) > > > > Thanks for bringing it back up, in any case. > > > > -- > > Mike Rylander > > | Executive Director > > | Equinox Open Library Initiative > > | phone: 1-877-OPEN-ILS (673-6457) > > | email: [email protected] > > | web: http://equinoxinitiative.org > > > > On Tue, Aug 13, 2019 at 1:39 PM Bill Erickson <[email protected]> wrote: > > > > > > Hi All, > > > > > > For a long time, Firefox didn't support date and time <inputs/> -- no > > calendar widget, no controls, etc. Because of this, we have traditionally > > relied on the date / time pickers provided by the toolkit (ng-bootstrap in > > Angular). > > > > > > However, Firefox does now support date [1], time [2], and datetime-local > > [3] input types, as does Chrome. Date selectors provide calendar widgets, > > all variations provide 'clear' actions, increment/decrement actions > > (buttons and arrow key), input validation, and manual entry w/ support for > > automatically jumping to the next field once a value part is entered (e.g. > > hours => minutes). > > > > > > It looks like they do everything we need, but I could be overlooking > > something... > > > > > > Is there any value in continuing to use the ng-bootstrap widgets for > > date and time selectors? Thoughts on migrating to native browser widgets? > > > > > > -b > > > > > > [1] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date > > > [2] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time > > > [3] > > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local > > > > > > -------------- next part -------------- > An HTML attachment was scrubbed... > URL: > <http://libmail.georgialibraries.org/pipermail/open-ils-dev/attachments/20190813/2d4b9d3d/attachment-0001.html> > > ------------------------------ > > Message: 4 > Date: Tue, 13 Aug 2019 14:53:14 -0400 > From: Bill Erickson <[email protected]> > To: Evergreen Development Discussion List > <[email protected]> > Subject: Re: [OPEN-ILS-DEV] Native browser date / time selectors in > Angular? > Message-ID: > <caejrdbqag8wvzppw1qeoqb6om-rue-jero4pocdbzf0ksd4...@mail.gmail.com> > Content-Type: text/plain; charset="utf-8" > > Thanks, Mike & Dan. > > I must have been bouncing around between browsers and saw what I wanted to > see in Chrome. *sigh* > > In any event, if we do move toward native widgets, we would presumably be > replacing the innards of the existing eg-date-select and forthcoming > datetime and time range selectors [1]. If so, using combinations of date > and time widgets in place of datetime-local should be an option, as long as > we retain the API. > > Regarding the time picker, I prefer direct entry, so the lack of a pop-up > didn't seem like a showstopper to me, but I could be in the minority on > that one. > > -b > > [1] https://bugs.launchpad.net/evergreen/+bug/1834662 > > > > On Tue, Aug 13, 2019 at 2:39 PM Dan Scott <[email protected]> wrote: > > > The Browser Support section agrees with caniuse.com about the lack of > > support in Firefox for datetime-local: > > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local#Browser_compatibility > > > > But date looks good and usable (per the live examples on the corresponding > > MDN page). Time is functional but I'm not sure it's as friendly as the > > ng-bootstrap implementation. > > > > On Tue, Aug 13, 2019 at 2:18 PM Mike Rylander <[email protected]> wrote: > > > >> First, +1M to using the builtins! > >> > >> However, I just fired up Firefox to test empirically and I'm getting > >> the default text input. CanIUse > >> (https://caniuse.com/#search=input-date) seems to agree that FF isn't > >> yet there with datetime-local, sadly. > >> > >> Hopefully soon? (Or we could drop FF support... j/k, mostly.) > >> > >> Thanks for bringing it back up, in any case. > >> > >> -- > >> Mike Rylander > >> | Executive Director > >> | Equinox Open Library Initiative > >> | phone: 1-877-OPEN-ILS (673-6457) > >> | email: [email protected] > >> | web: http://equinoxinitiative.org > >> > >> On Tue, Aug 13, 2019 at 1:39 PM Bill Erickson <[email protected]> wrote: > >> > > >> > Hi All, > >> > > >> > For a long time, Firefox didn't support date and time <inputs/> -- no > >> calendar widget, no controls, etc. Because of this, we have traditionally > >> relied on the date / time pickers provided by the toolkit (ng-bootstrap in > >> Angular). > >> > > >> > However, Firefox does now support date [1], time [2], and > >> datetime-local [3] input types, as does Chrome. Date selectors provide > >> calendar widgets, all variations provide 'clear' actions, > >> increment/decrement actions (buttons and arrow key), input validation, and > >> manual entry w/ support for automatically jumping to the next field once a > >> value part is entered (e.g. hours => minutes). > >> > > >> > It looks like they do everything we need, but I could be overlooking > >> something... > >> > > >> > Is there any value in continuing to use the ng-bootstrap widgets for > >> date and time selectors? Thoughts on migrating to native browser widgets? > >> > > >> > -b > >> > > >> > [1] > >> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date > >> > [2] > >> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time > >> > [3] > >> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local > >> > > >> > > > -------------- next part -------------- > An HTML attachment was scrubbed... > URL: > <http://libmail.georgialibraries.org/pipermail/open-ils-dev/attachments/20190813/3c523495/attachment.html> > > End of Open-ils-dev Digest, Vol 160, Issue 6 > ******************************************** -- Jane Sandberg Electronic Resources Librarian Linn-Benton Community College [email protected] / 541-917-4655 Pronouns: she/her/hers
