Skip to content

[FEATURE] Convert legacy color notation to modern css 4 notation #1442

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
8ctopus wants to merge 2 commits into
base: main
Choose a base branch
from
Open

[FEATURE] Convert legacy color notation to modern css 4 notation #1442

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
49a07f2
[FEATURE] Convert legacy color notation to modern css 4 notation
8ctopus Dec 25, 2025
ce24ecd
[CLEANUP] use \ prefix when calling a global function
8ctopus Dec 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion src/Value/Color.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -285,7 +285,7 @@
{
$result = \sprintf(
'%02x%02x%02x',
$this->components['r']->getSize(),

Check failure on line 288 in src/Value/Color.php

View workflow job for this annotation

GitHub Actions / Static Analysis (php:stan, 8.3) 

Ignored error pattern #^Cannot call method getSize\(\) on Sabberworm\\CSS\\Value\\Value\|string\.$# (method.nonObject) in path /home/runner/work/PHP-CSS-Parser/PHP-CSS-Parser/src/Value/Color.php is expected to occur 3 times, but occurred 4 times.
$this->components['g']->getSize(),
$this->components['b']->getSize()
);
Expand Down Expand Up @@ -324,7 +324,10 @@
foreach ($this->components as $key => $value) {
if ($key === 'a') {
// Alpha can have units that don't match those of the RGB components in the "legacy" syntax.
// So it is not necessary to check it. It's also always last, hence `break` rather than `continue`.
if ($value->getUnit() === '%' || \is_float($value->getSize())) {

Check failure on line 327 in src/Value/Color.php

View workflow job for this annotation

GitHub Actions / Static Analysis (php:stan, 8.3) 

Cannot call method getUnit() on Sabberworm\CSS\Value\Value|string.

Check failure on line 327 in src/Value/Color.php

View workflow job for this annotation

GitHub Actions / Static Analysis (php:stan, 8.3) 

Cannot call method getSize() on Sabberworm\CSS\Value\Value|string.
$hasPercentage = true;
}

break;
}
if (!($value instanceof Size)) {
Expand Down
10 changes: 5 additions & 5 deletions tests/ParserTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ public function colorParsing(): void
self::assertSame('red', $colorValue);
}
self::assertSame(
'#mine {color: red;border-color: #0a64e6;border-color: rgba(10,100,231,.3);outline-color: #222;'
'#mine {color: red;border-color: #0a64e6;border-color: rgba(10 100 231/.3);outline-color: #222;'
. "background-color: #232323;}\n"
. "#yours {background-color: hsl(220,10%,220%);background-color: hsla(220,10%,220%,.3);}\n"
. '#variables {background-color: rgb(var(--some-rgb));background-color: rgb(var(--r),var(--g),var(--b));'
Expand Down Expand Up @@ -310,7 +310,7 @@ public function manipulation(): void
self::assertSame(
'#header {margin: 10px 2em 1cm 2%;font-family: Verdana,Helvetica,"Gill Sans",sans-serif;'
. 'font-size: 10px;color: red !important;background-color: green;'
. 'background-color: rgba(0,128,0,.7);frequency: 30Hz;transform: rotate(1turn);}
. 'background-color: rgba(0 128 0/.7);frequency: 30Hz;transform: rotate(1turn);}
body {color: green;font: 75% "Lucida Grande","Trebuchet MS",Verdana,sans-serif;}',
$document->render()
);
Expand All @@ -319,7 +319,7 @@ public function manipulation(): void
}
self::assertSame(
'#header {margin: 10px 2em 1cm 2%;color: red !important;background-color: green;'
. 'background-color: rgba(0,128,0,.7);frequency: 30Hz;transform: rotate(1turn);}
. 'background-color: rgba(0 128 0/.7);frequency: 30Hz;transform: rotate(1turn);}
body {color: green;}',
$document->render()
);
Expand Down Expand Up @@ -559,8 +559,8 @@ public function urlInFile(): void
public function hexAlphaInFile(): void
{
$document = self::parsedStructureForFile('hex-alpha', Settings::create()->withMultibyteSupport(true));
$expected = 'div {background: rgba(17,34,51,.27);}
div {background: rgba(17,34,51,.27);}';
$expected = 'div {background: rgba(17 34 51/.27);}
div {background: rgba(17 34 51/.27);}';
self::assertSame($expected, $document->render());
}

Expand Down
14 changes: 7 additions & 7 deletions tests/Unit/Value/ColorTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,11 +41,11 @@ public static function provideValidColorAndExpectedRendering(): array
],
'4-digit hex color (with alpha)' => [
'#0707',
'rgba(0,119,0,.47)',
'rgba(0 119 0/.47)',
],
'8-digit hex color (with alpha)' => [
'#0077007F',
'rgba(0,119,0,.5)',
'rgba(0 119 0/.5)',
],
'legacy rgb that can be represented as 3-digit hex' => [
'rgb(0, 119, 0)',
Expand All @@ -61,11 +61,11 @@ public static function provideValidColorAndExpectedRendering(): array
],
'legacy rgba with fractional alpha' => [
'rgba(0, 119, 0, 0.5)',
'rgba(0,119,0,.5)',
'rgba(0 119 0/.5)',
],
'legacy rgba with percentage alpha' => [
'rgba(0, 119, 0, 50%)',
'rgba(0,119,0,50%)',
'rgba(0 119 0/50%)',
],
'legacy rgba with percentage components and fractional alpha' => [
'rgba(0%, 60%, 0%, 0.5)',
Expand All @@ -81,7 +81,7 @@ public static function provideValidColorAndExpectedRendering(): array
],
'legacy rgba as rgb' => [
'rgb(0, 119, 0, 0.5)',
'rgba(0,119,0,.5)',
'rgba(0 119 0/.5)',
],
'modern rgb' => [
'rgb(0 119 0)',
Expand Down Expand Up @@ -129,11 +129,11 @@ public static function provideValidColorAndExpectedRendering(): array
],
'modern rgba with fractional alpha' => [
'rgb(0 119 0 / 0.5)',
'rgba(0,119,0,.5)',
'rgba(0 119 0/.5)',
],
'modern rgba with percentage alpha' => [
'rgb(0 119 0 / 50%)',
'rgba(0,119,0,50%)',
'rgba(0 119 0/50%)',
],
'modern rgba with percentage R' => [
'rgb(0% 119 0 / 0.5)',
Expand Down
Loading