murmurcreative / module-drawer Goto Github PK

This is a simple accessibility thing that we should try and automate. Maybe something like:

If a controller item is available to the drawer, either:
a) Get the drawer ID, and set that as the aria-controls value
b) Generate a unique ID (if not set) and set that as the aria-controls value

If the drawer can't find a controller, then don't bother--no need to try and get fancy about it.

It should :(

The current release build process generates a compiled file that works fine, but if imported via webpack (or mix) causes a warning like this to be thrown on build:

WARNING in ./node_modules/@murmurcreative/drawer/dist/index.js 1:292-296
Critical dependency: the request of a dependency is an expression
 @ ./resources/assets/scripts/modules/primary-nav.js
 @ ./resources/assets/scripts/app.js
 @ multi ./resources/assets/scripts/app.js ./resources/assets/styles/app.css ./resources/assets/styles/editor.css

This error seems to be a result of how Parcel compiles things down to a single file, using it's own require functionality, which webpack then complains about.

So far as I can tell this has no negative effects (beyond throwing this error) but the intent for this package is for it to be simple, easy, and understandable, and arcane errors are counter to those goals.

Potential solutions:

1. Don't use parcel to build
2. Don't worry about compiling into a single file

Since I'd like to generate a single artifact people can import and then go, I'm leaning toward option 1, much as I like Parcel.

We've run into consistent issue with IE (and occasionally Edge) w/r/t to their lack of support for particular aspects of the libraries and technologies used in this module. It's a pain in the ass and I hate it, and we really get very little use out of the things that make web components unique (i.e. the Shadow DOM) and in fact end up fighting against them a lot. It's time for a v2 that removes the web component dependency and Just Works in at least some subset of older browsers.

The exact structure of this new plugin is under discussion and consideration, but I'm leaning strongly toward something similar to the original site-navigation package that inspired this one: It expects a particular HTML layout, and then hooks into that to add some events, functionality, etc. This is simpler and uses a pattern long familiar to web developers, and also makes it easier to style--no more dicking around with the Shadow DOM.

The intent is also to make all aspects of this package more module: The original design was an implementation of Inclusive Components' Collapsible Sections. While I'd like to remain heavily influenced by that design and it's accessibility goals, I also want to make the bare module-drawer less opinionated and more flexible in the view of a Linux program: All functionality should be focused on doing one thing, and doing it well. For more complex things, compose this package with others.

I'd like to have some code snippets that are more or less copy-and-go for common use cases (i.e. navigation).

Ultimately it might be nice to have some small associated packages the collect that functionality is a pre-packaged way w/ Drawer as a dependency.

Not adding this to the 2.0 milestone because the package is simple enough that I feel okay about no tests (and I have no experience writing JS testing, so it may be a long road), but tests should definitely be implemented to make future development/enhancement quicker and safer.

Short version: IE doesn't do a redraw when data- attributes change.
Long version: https://stackoverflow.com/questions/31588262/css-styling-via-data-attribute-is-not-working-properly-on-ie

Apparently you can get around this by using get/setAttribute(), which does(??) trigger a redraw. Hopefully I can just slip in a shim that uses that instead and we'll be golden.

This should roughly duplicate the same functionality from v1.

Good practice and should help make future dev safer.

This issue was generated by todo based on a TODO comment in 27d5ebd. It's been assigned to @alwaysblank because they committed the code.