Problem/Motivation

Add the library and associated assets.

Steps to reproduce

Proposed resolution

Remaining tasks

User interface changes

API changes

Data model changes

CommentFileSizeAuthor
#16 README.md31.02 KBbnjmnm
Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

bnjmnm created an issue. See original summary.

nod_’s picture

Title: Build 1.0 » Create autocomplete JS library

retitled to make it look better on in the core js queue

bnjmnm’s picture

Some questions I have about assembling this

  • Are there a preferred testing tools to use for this? I could make Nightwatch tests based on the shim tests in core, but I don't see much Nightwatch in new libraries which has me wondering if something else is preferred.
  • The autocomplete uses a JS Class, but core needs to support IE11 for the rest of 9. I'm curious if there are opinions surrounding if an IE compatbile build should be the default or an additional option/version.
bnjmnm’s picture

Several polyfills are needed to support IE11: fetch, es6-promise, element.closest, and CustomEvent. Unsure if it's best to make that part of the build in this package, or let Drupal take care of that. es6-promise is already in core.

justafish’s picture

@bnjmnm I like Nightwatch, but if you think there's a more appropriate tool then I think that's fine too. Once didn't use Nightwatch because it's not testing any UI interactions.

Could we get rid of the class syntax so this isn't an issue? Anecdotally they seem to be increasingly unpopular since they're only syntactic sugar and not really OOP anyway. For the polyfills let's have Drupal take care of that, we'll probably end up with polyfills embedded multiple times otherwise.

Just a heads up you might want to take a look at https://www.drupal.org/project/once/issues/3201195 since I had to remove "type: module" from package.json as it doesn't play very nicely with other packages (like Nightwatch)

lauriii’s picture

Re #4: I don't think we should ship polyfills as part of the build in this package - it should be the responsibility of the projects to add dependency on required polyfills. We could document in the project which polyfills are required for IE 11 support.

bnjmnm’s picture

There's also spread operator usage that won't work with IE11. Is there a preferred approach for that?

justafish’s picture

@bnjmnm can we use .apply instead?

bnjmnm’s picture

Status: Active » Needs review

I set the merge request to ready, aware that there are multiple unaddressed comments. I'd like to get this initial commit in so work can be split into multiple issues that can be worked on simultaneously. Could the commit-blocking feedback be limited to things that could set bad precedence in the followup issues? For example, if there are problems with the overall Nightwatch testing setup, that should get addressed here as it impacts how test are written in later issues. Changes to the class itself, docs, etc I think can safely be addressed in followups.

Also worth mentioning: Although the generated README.md has been deferred to be worked on in a separate issue, there is a README.old.md that has a decent amount of API documentation already, and will be helpful for contributors working on issues before the generated docs are ready.

nod_’s picture

Status: Needs review » Needs work

Thanks!

  1. There are test files at the root (db.json, server.js, jsonServer.js), I'd rather have them in a subdirectory so it's easier to group and exclude from the package.
  2. I know it's a bit annoying but README.old.md doesn't look good for an initial commit. I'd rather remove the jsdoc2md command from package.json and keep the furnished readme as README.md and open an issue to fix README generation.
  3. A bit of mix and match with npm, yarn, etc. we should either use yarn or not in package.json scripts (looking at the test:nightwatch command)
  4. eslint/prettier, we should have the prettier plugin for eslint so no need for a dedicated command no?
  5. The indent of .eslintrc.json is all over the place, not a huge deal but it's an easy fix :)
  6. To discuss but I'd rename everything autocomplete not a11y.autocomplete to avoid issues with L and 1 (including package name, so @drupal/autocomplete, we keep the namespace on drupal.org for now, might end up in the monorepo down the line)
  7. The license bit is deprecated, see #3211084: fix license information on npmjs.com for how to change it

In any case, good start :)

bnjmnm’s picture

Status: Needs work » Needs review

I believe #11 is addressed. Switching back to Needs Review and we'll see if that's the case...

nod_’s picture

Status: Needs review » Needs work

Pre commit:

  1. For me only thing left is to have a functional yarn build

    seems like a yarn build has some funky results, the generated file in dist is not usable in a browser :

    "use strict";
    
    require("core-js/modules/es.symbol.js");
    
    // … 
    

    the rest of the commands are working as expected.

Post commit:

  • I still think the name should be changed to drop the a11y part but that can be done until we release the first version.
  • for the testing I'm wondering if there isn't a simper way than spawning a bunch of servers to serve a static html+json file. It's not a blocker but would be good to improve before v1.0.0
  • @justafish: what do you think?

bnjmnm’s picture

Status: Needs work » Needs review

The build should now works in a browser. Manually tested and temporarily switched the tests use to use assets from /dist instead of /src. Before changing the build, the test would not work loading from /dist

nod_’s picture

Assigned: bnjmnm » Unassigned
Status: Needs review » Reviewed & tested by the community

That looks better :)

Good enough MVP for me, could use a +1 from justafish if she has some time.

bnjmnm’s picture

FileSize
31.02 KB

In a separate branch I have improved docs and basic jsdoc2md set up (no templates at the moment). The end result is the README.md attached here.

I could add that to this branch, which may help with the followup issues, particularly since events are now documented. Refinements could still happen here: #3211252: Generated Readme .

However, if there's a risk that adding this generated README would delay this issue by more than a minute or two, it should probably wait.

nod_’s picture

let's keep the readme to the other issue. The template is not necessary if the default output is good, let's talk about that in the related issue :)

Just giving some time to sally to have a look.

justafish’s picture

Status: Reviewed & tested by the community » Needs work
bnjmnm’s picture

Status: Needs work » Needs review

@lauriii or myself responded to every point that kicked this back to "Needs Work" in #18. I only set ones to "unresolved" where it wouldn't be presumptuous to do so, but hopefully most (all?) are suitable for "resolved" status.

  • 7c77226 committed on 1.0.x
    Issue #3204530 by justafish: Suppress .yarn directory diffs
    
justafish’s picture

Status: Needs review » Needs work

I've pushed some updates -

  • Moves to Yarn 2
  • Replaces chromedriver with geckodriver (as it wasn't working for me)
  • Adds the prettier and eslint configurations from once.js
  • Adds a GitLab CI file for running tests and releases
  • Adds export metadata to package.json
  • Abstracts the class implementation with a factory function so we can change it later if we want without breaking the API
  • Updated dependencies

The test doesn't seem to be passing - I added the GitLab CI file first so you can see it failing before I added the factory https://git.drupalcode.org/project/a11y_autocomplete/-/jobs/7385

  • nod_ committed 64e02f5 on 1.0.x authored by bnjmnm
    Issue #3204530 by bnjmnm: Create autocomplete JS library
    
justafish’s picture

Status: Needs work » Reviewed & tested by the community

@nod_ and I are going to merge this and then open follow up issues individually for pre-release items

nod_’s picture

Status: Reviewed & tested by the community » Fixed

All good :) Sally will open a couple of follow-ups

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.