Vitest expect does not allow toContain with DOMTokenList and string.

[bodograumann]

Describe the bug

I'm using vitest via @storybook/test and want to assert that an element has a certain class. With jest the following worked:

export const MyStory = {
    play: async ({ canvasElement }) => {
        import { expect, within } from "@storybook/test";

        const canvas = within(canvasElement);
        expect(canvas.getByText("some text").classList).toContain("my-css-class");
    }
};

But vitest gives this weird error:

the given combination of arguments (domtokenlist and string) is invalid for this assertion. You can use an array, a map, an object, a set, a string, or a weakset instead of a string

The error message obviously doesn't make sense, because it proposes giving a string instead of a string.

As a workaround the following works in vitest:

        expect(Array.from(canvas.getByText(text).classList)).toContain("annotation");

Reproduction

I hope the underlying issue is clear enough without a reproduction of this specific instance.

System Info

System:
    OS: Linux 6.6 Arch Linux
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700H
    Memory: 46.52 GB / 62.49 GB
    Container: Yes
    Shell: 5.9 - /usr/bin/zsh
  Binaries:
    Node: 21.5.0 - /usr/bin/node
    Yarn: 1.22.21 - /usr/bin/yarn
    npm: 10.2.5 - /usr/bin/npm
    pnpm: 8.13.1 - /usr/bin/pnpm
  Browsers:
    Chromium: 120.0.6099.129
  npmPackages:
    @vitejs/plugin-vue: ^5.0.0 => 5.0.2
    @vitest/coverage-v8: ^1.0.0 => 1.1.1
    vite: ^5.0.0 => 5.0.10
    vitest: ^1.0.0 => 1.1.1

Used Package Manager

npm

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[sheremet-va]

Vitest supports toContain with classList since 1.0.

[github-actions[bot]]

Hello @bodograumann. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with need reproduction will be closed if they have no activity within 3 days.

[danlourenco]

Vitest supports toContain with classList since 1.0.

I seem to be having the same issue, and we're using Vitest 1.1.3. I'll work on a repo shortly.

[danlourenco]

Actually, as a follow up, my problem is that toContain used to work by passing an array of strings expected in the classList. It appears that toContain how only expects one argument (and not an array), breaking my previous implementation.

[sheremet-va]

Actually, as a follow up, my problem is that toContain used to work by passing an array of strings expected in the classList. It appears that toContain how only expects one argument (and not an array), breaking my previous implementation.

The reproduction in this issue doesn't use an array. If you think it's a bug, you can open a separate issue with your reproduction. I'd say this is unexpected usage: .toContain expects an item of the array, not a subset of items (this is how it works in jest). When using chai API you can use expect([1, 2, 3]).to.contain([1, 2]) because it's a separate implementation from Jest.