stylex icon indicating copy to clipboard operation
stylex copied to clipboard

[style-value-parser] implement "soft" validation of queries

Open mellyeliu opened this issue 4 months ago • 0 comments

Add a config to the try/catch to flag hard errors in enableMediaQueryOrder and fallback to pre-existing behaviour. Find a way to log or capture errors, possibly in new lint rule for the parser

See: https://github.com/facebook/stylex/pull/1147 where config was added

  1. Add new config to NOT throw when lastMediaQueryWinsTransform fails in this try catch. Have it just "log" a warning - either through a linter or through other means. Investigate this: https://github.com/facebook/stylex/blob/main/packages/%40stylexjs/babel-plugin/src/shared/preprocess-rules/flatten-raw-style-obj.js#L29-L36
  2. If needed, add a lint rule that checks for lastMediaQueryWinsTransform on media queries. You will need to add style-value-parser as a build step in npm in eslint-plugin. Lint rule should warn that media query order will NOT be respected if lastMediaQueryWinsTransform fails. This could be due to invalid media query OR edge cases missed in style-value-parser
  3. Sync to WWW. See error volume. Turn the enforceMediaQueryOrder config ON internally.

mellyeliu avatar Aug 19 '25 00:08 mellyeliu