Skip to content

Commit

Permalink
ci: Check for use of SCSS random() (#40666)
Browse files Browse the repository at this point in the history
Normal CSS can't do random numbers. SCSS has a `random()` function,
which produces random values in the output CSS. Unfortunately this makes
the built CSS change for each build, which means that every PR merged
will require a Simple deploy. To avoid this, add a CI check looking for
calls to the function in all `.scss` files.

Also do the same for `unique-id()`.
  • Loading branch information
anomiex authored Dec 18, 2024
1 parent 21b4c4f commit 3ed576d
Show file tree
Hide file tree
Showing 3 changed files with 26 additions and 3 deletions.
11 changes: 11 additions & 0 deletions .github/files/lint-project-structure.sh
Original file line number Diff line number Diff line change
Expand Up @@ -635,4 +635,15 @@ while IFS= read -r FILE; do
done < <( git grep -h --line-number --column -o "$RE" "$FILE" )
done < <( git -c core.quotepath=off grep -l "$RE" )

# - Check for `random(` in scss files.
debug "Checking for SCSS random."
while IFS= read -r FILE; do
EXIT=1
while IFS=: read -r LINE COL X; do
X=${X%(}
echo "::error file=$FILE,line=$LINE,col=$COL::Do not use SCSS \`$X()\`. It means that every build will have different CSS, dirtying the diffs (and making for redudant Simple deploys if this gets into a relevant plugin)."
done < <( git grep -h --line-number --column -o '\(random\|unique-id\)\s*(' "$FILE" )
done < <( git -c core.quotepath=off grep -l '\(random\|unique-id\)\s*(' '*.sass' '*.scss' )


exit $EXIT
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: patch
Type: fixed

Holiday snow: Replace SCSS `random()` with pregenerated arrays of random numbers to make builds reproducable.
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,22 @@ $snow_density: 10;
$snow_speed: 9s;
$snow_selector: '#jetpack-holiday-snow';

// Random numbers, to replace the `random` function so we can have reproducable builds.
// Needs $snow_density entries. Intergers 3-6.
$snow_sizes: 6, 6, 3, 5, 3, 4, 6, 5, 4, 6;
// Needs $snow_density entries. Floats 0.6-1.0.
$snow_alphas: 0.8, 1, 0.9, 1, 0.6, 1, 1, 1, 0.8, 1;
// Needs $snow_density * 2 entries. Floats 0-1.
$snow_positions: 0.17857, 0.30782, 0.65476, 0.04422, 0.31145, 0.02525, 0.72542, 0.19153, 0.26094, 0.12121, 0.47466, 0.76351, 0.46259, 0.92007, 0.24915, 0.44915, 0.19088, 0.86993, 0.62925, 0.68707;

html {
$grad: (
);

@for $i from 0 to $snow_density {
$v: random(4) + 2;
$alpha: random(5) * .1 + .5;
$grad: $grad, radial-gradient($v+px $v+px at (random($grid_width - $v * 2) + $v)+px (random($grid_width - $v * 2) + $v)+px,
$v: nth($snow_sizes, $i + 1);
$alpha: nth($snow_alphas, $i + 1);
$grad: $grad, radial-gradient($v+px $v+px at (round(nth($snow_positions, $i * 2 + 1) * ($grid_width - $v * 2)) + $v)+px (round(nth($snow_positions, $i * 2 + 2) * ($grid_width - $v * 2)) + $v)+px,
rgba(255, 255, 255, $alpha) 50%,
rgba(0, 0, 0, 0));
}
Expand Down

0 comments on commit 3ed576d

Please sign in to comment.