Skip to content

feat: Corner Smoothing CSS rule (Reland) #46278

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

Jump to bottom
Merged
merged 4 commits into from
Mar 31, 2025
Merged

feat: Corner Smoothing CSS rule (Reland) #46278

merged 4 commits into from
Mar 31, 2025

Conversation

clavin
Copy link
Member

@clavin clavin commented Mar 25, 2025

Reland of #45185.

Reason for revert: There was a delay between the last push and merge which caused patch conflicts on main.

Implementation for RFC 12: Corner Smoothing.

Applying border-radius to an element makes its corners circular. This proposal adds "smoother" round corners, controlled by a prefixed CSS property. Applications can use this feature to further integrate with macOS's design language, or simply for aesthetic purposes.

In this PR

  • A medium patch to Blink
    • Metadata, boilerplate, and a few lines of parsing to add the CSS rule: -electron-corner-smoothing
    • Smoothness added to the representation of contoured rectangles
    • Branches in rendering code to handle smooth corners
    • Renderer preference to disable the CSS rule
    • A lot of plumbing (for the preference & CSS value)
  • Geometric implementation of the rendering procedure described in Desperately Seeking Squircles
  • A new WebContents preference: enableCornerSmoothingCSS
    • Plumbing to get this value into Blink
  • Documentation
  • Image-based render tests
    • Only runs in CI (because image-based testing is very difficult)

(NB: Release notes will be picked up from the original PR, so I'm putting "none" here.)

Notes: none

@clavin clavin added semver/minor backwards-compatible functionality target/36-x-y PR should also be added to the "36-x-y" branch. labels Mar 25, 2025
@clavin clavin requested a review from a team as a code owner March 25, 2025 22:11
@jkleinsc jkleinsc added the api-review/skip-delay ⏰ Skip the mandatory 7 day waiting period for new APIs label Mar 26, 2025
jkleinsc
jkleinsc reviewed Mar 26, 2025
View reviewed changes
Copy link
Member

@jkleinsc jkleinsc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

API LGTM

ckerr
ckerr reviewed Mar 26, 2025
View reviewed changes
Copy link
Member

@ckerr ckerr left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

API LGTM

clavin added 2 commits March 27, 2025 12:42
@clavin
fixup! Fix patch conflicts
a78729a
@clavin
Update expected image
a48f053 
The dashed border is subtly different. The new version is correct and the old one was incorrect.
@ckerr
Copy link
Member

ckerr commented Mar 28, 2025

a48f053
The dashed border is subtly different. The new version is correct and the old one was incorrect.

64icd0

@ckerr
Copy link
Member

ckerr commented Mar 28, 2025

Heads-up to @samuelmaddock since I think this conflicts with the Chromium roll.

If the Chromium roll is close to being ready, then y'all should probably decide on which PR to load first 🙂

@ckerr ckerr merged commit 0913544 into main Mar 31, 2025
55 of 56 checks passed
@ckerr ckerr deleted the clavin/corner-smoothing-reland branch March 31, 2025 16:22
@release-clerk
Copy link

release-clerk bot commented Mar 31, 2025

No Release Notes

@trop trop bot mentioned this pull request Mar 31, 2025
Merged
@trop
Copy link
Contributor

trop bot commented Mar 31, 2025

I have automatically backported this PR to "36-x-y", please check out #46385

@trop trop bot added in-flight/36-x-y merged/36-x-y PR was merged to the "36-x-y" branch. and removed target/36-x-y PR should also be added to the "36-x-y" branch. in-flight/36-x-y labels Mar 31, 2025
kigh-ota pushed a commit to kigh-ota/electron that referenced this pull request Sep 30, 2025
@clavin @kigh-ota
feat: Corner Smoothing CSS rule (Reland) (electron#46278)
e432865 
* feat: Corner Smoothing CSS rule (Reland)

Reland of electron#45185

* Fix patch conflicts

* fixup! Fix patch conflicts

* Update expected image

The dashed border is subtly different. The new version is correct and the old one was incorrect.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@jkleinsc jkleinsc jkleinsc left review comments

@ckerr ckerr ckerr approved these changes

Assignees

No one assigned

Labels

api-review/requested 🗳 api-review/skip-delay ⏰ Skip the mandatory 7 day waiting period for new APIs merged/36-x-y PR was merged to the "36-x-y" branch. new-pr 🌱 PR opened recently semver/minor backwards-compatible functionality

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@clavin @ckerr @jkleinsc