search

patternfly / patternfly-elements

PatternFly Elements. A set of community-created web components based on PatternFly design.
https://patternflyelements.org/
MIT License
380 stars 96 forks source link

[CI] Add more automated tests // determine how-to for style tests #580

Open starryeyez024 opened 5 years ago

starryeyez024 commented 5 years ago

pfe-band and pfe-card are the only components with AT for testing styles. We need to determine how to write tests for CSS vars.

castastrophe commented 4 years ago

Design tokens!!! #solvesAllTheProblems

If we're storing our defaults in a design token for each component, we can import that into the test file and auto-generate tests.

castastrophe commented 4 years ago

pfe-accordion.json

{
  "BorderRadius": {
    "value": "$pf-global--surface--border-radius"
  },
  "BackgroundPosition": {
    "value": "center center"
  }
}

...where $pf-global--surface--border-radius: var(--pf-global--surface--BorderRadius, 3px)

In the pfe-accordion sass, the token could print: $local--BorderRadius: var(--pfe-accordion--BorderRadius, var(--pf-global--surface--BorderRadius, 3px));