parcel-bundler / parcel-bundler/lightningcss
Strange behavoiur for prefixing property `user-select`
Nobody has claimed this yet.
- Dominant language
- Rust
- Stars
- 7.7k
- Forks
- 302
- PR merge metrics
- No merged PRs in 30d
Description
Sandbox demo: https://stackblitz.com/edit/stackblitz-starters-ssfut1yt?file=lightningcss.js
I have CSS:
pre {
user-select: all;
}
On this moment, Safari doesn't support user-select without vendor-prefix.
For adding prefixes i use this browserslist config:
last 2 versions
not dead
And code for compiling:
import * as lightningcss from 'lightningcss';
import browserslist from 'browserslist';
const browsers = browserslist();
const targets = lightningcss.browserslistToTargets(browsers);
console.log('browserslist: ', browsers);
console.log('lightningcss: ', targets);
const result = await lightningcss.bundleAsync({
targets,
filename: './styles.css',
});
console.log(result.code.toString());
i get unprefixed code:
pre {
user-select: all;
}
but Safari is in the list:
browserslist: [
'and_chr 133', 'and_ff 135',
'and_qq 14.9', 'and_uc 15.5',
'android 133', 'chrome 133',
'chrome 132', 'edge 133',
'edge 132', 'firefox 135',
'firefox 134', 'ios_saf 18.3',
'ios_saf 18.2', 'kaios 3.0-3.1',
'kaios 2.5', 'op_mini all',
'op_mob 80', 'opera 114',
'opera 113', 'safari 18.3',
'safari 18.2', 'samsung 27',
'samsung 26'
]
lightningcss: {
and_chr: 8716288,
and_ff: 8847360,
android: 8716288,
chrome: 8650752,
edge: 8650752,
firefox: 8781824,
ios_saf: 1180160,
op_mob: 5242880,
opera: 7405568,
safari: 1180160,
samsung: 1703936
}
LightningCSS Playground have correct prefixed code.
Postcss have another result.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the StackBlitz lightningcss.js reproduction and inspect the targets produced by browserslistToTargets before bundleAsync runs. Compare the generated user-select output with the LightningCSS Playground for the same Safari targets. Done means the compiler emits the required vendor-prefixed declaration for the reported targets without changing unrelated output.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript, rust
- Domain
- compilers, tooling
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100