makeup / makeup-js

Mono-repo for all vanilla JavaScript utility modules and headless ui
https://makeup.github.io/makeup-js
42 stars 10 forks source link

Allow a way to reset the makeup-next-id so that consistent IDs can be used for testing purposes #1

Open melquan opened 4 years ago

melquan commented 4 years ago

When using jest and doing fixture snapshot tests (via @marko/fixture-snapshots), we are seeing new IDs generated by makeup-next-id so the tests fail noting mismatch in IDs.

Example:

-                   id="nid-Ed--0"
+                  id="nid-3rD-0"

It would be nice to allow a way to reset the makeup-next-id so that consistent IDs can be used for testing purposes.

ianmcburnie commented 4 years ago

Will look into it! Thanks.

ianmcburnie commented 4 years ago

@melquan You know that if the element already has an ID, then this module will leave it in place? Or do you mean IDs for elements that are not created by you? Like makeup-active-descendant for example.

melquan commented 4 years ago

The IDs are not created by us. We have 3 instances of these generated IDs in the fixture snapshot.

First is where have an ebay-infotip in the template:

<ebay-infotip
    pointer="..."
    aria-label="..."
    a11y-close-text="...">
    ...
</ebay-infotip>

HTML generated in the snapshot:

<span>
    <span>
        <span
            class="infotip"
            id="nid-Ed--0"
        >

Second is where we have a div like this:

<div
    key="key"
    class="..."
>

and then call ActiveDescendant.createLinear on it from makeup-active-descendant.

HTML generated in the snapshot:

<div
    class="..."
    id="nid-Ed--1"
>

Third is an li which is inside the div above:

<li
    key:scoped="..."
    class="..."
    role="option"
    aria-selected=""
    tabindex="-1"
    data-testid="..."
    on-click('...')>

HTML generated in the snapshot:

<li
    aria-selected=""
    class="..."
    data-makeup-index="0"
    data-testid="..."
    id="nid-Ed--2"
    role="option"
    tabindex="-1"
>

Let me know if you need more information.

ianmcburnie commented 4 years ago

Thanks for the info @melquan. I could certainly rejig the APIs around to support this, but before I do that, is there no way to signal those ids as dynamic in the fixture testing framework?

melquan commented 4 years ago

I'm not familiar enough with the capabilities within the fixture testing framework to know if that's possible. Perhaps @DylanPiercey could provide some insight.