Skip to content

Feature Request: Add support for CSS Modules localIdentName #125

Open
@SimulatedGREG

Description

@SimulatedGREG

When using CSS modules in combination with @vue/test-utils, the DOM is created with class names equal to those that are defined within the <style/> block. For my company we use a custom localIdentName that is different from this default. It would be nice if the outputted class names could use a custom localIdentName.

This is useful for us specifically because we take an approach where each UI component we write should be wrapped with a .component class. So with a localIndentName of [name]-[local] each component would output something with a class name like .ui-button-component or .ui-input-component (where ui-button and ui-input are the filenames of our components).

Without the support for localIdentName in vue-jest, all of our wrapper classes are .component which, I'm sure you can imagine, can make it difficult when testing UI states where a specific DOM lookup is needed.

Hopefully this is enough to get my idea across, if not please feel free to ask any questions or perhaps I might be able to provide a thorough example. I am also aware since there isn't any use of webpack, nor more specifically css-loader, this may not be possible. But of course, please share any ideas for getting this to work!

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions