Skip to content

Commit

Permalink
Preserve -webkit-box-orient when -webkit-line-clamp is present
Browse files Browse the repository at this point in the history
  • Loading branch information
Goodwine committed Feb 29, 2024
1 parent 46cd2cc commit 987e9aa
Show file tree
Hide file tree
Showing 4 changed files with 78 additions and 2 deletions.
8 changes: 7 additions & 1 deletion lib/processor.js
Original file line number Diff line number Diff line change
Expand Up @@ -712,7 +712,13 @@ class Processor {
* Some rare old values, which is not in standard
*/
withHackValue(decl) {
return decl.prop === '-webkit-background-clip' && decl.value === 'text'
return (
(decl.prop === '-webkit-background-clip' && decl.value === 'text') ||
// Do not remove -webkit-box-orient when -webkit-line-clamp is present.
// https://github.com/postcss/autoprefixer/issues/1510
(decl.prop === '-webkit-box-orient' &&
decl.parent.some(d => d.prop === '-webkit-line-clamp'))
)
}
}

Expand Down
4 changes: 3 additions & 1 deletion test/autoprefixer.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -1178,8 +1178,10 @@ test('supports text-decoration shorthand', () => {

test('supports -webkit-line-clamp', () => {
let input = read('webkit-line-clamp')
let output = read('webkit-line-clamp.out')
let result = postcss([cleaner]).process(input)
equal(result.css, input)

equal(universalizer(result.css), universalizer(output))
equal(result.warnings().length, 0)
})

Expand Down
31 changes: 31 additions & 0 deletions test/cases/webkit-line-clamp.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,34 @@
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.simple-clamp {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.clamp-with-flex-direction {
flex-direction: column;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.clamp-with-flex-direction-and-box-direction {
flex-direction: column;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-line-clamp: 2;
}

.clamp-display-webkit-box-only {
display: -webkit-box;
-webkit-line-clamp: 2;
}

.clamp-display-webkit-box-orient-vertical-only {
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
37 changes: 37 additions & 0 deletions test/cases/webkit-line-clamp.out.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
.limit-text {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.simple-clamp {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.clamp-with-flex-direction {
flex-direction: column;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.clamp-with-flex-direction-and-box-direction {
flex-direction: column;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.clamp-display-webkit-box-only {
display: -webkit-box;
-webkit-line-clamp: 2;
}

.clamp-display-webkit-box-orient-vertical-only {
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

0 comments on commit 987e9aa

Please sign in to comment.