[css-ui-3] Should outline-style:auto follow border-radius curve?

[BillGoldstein]

Should outline-style:auto follow border-radius curve?
https://drafts.csswg.org/css-ui-3/#outline-props

If not, should there be spec language that says following border-radius curve should only apply to
non-auto <border-style>?

Note that UAs might choose to apply a (possibly platform-specific) default curve with outline-style:auto

[MatsPalmgren]

I tend to think it shouldn't. The whole purpose of outline-style:auto is to provide a platform-specific outline. Both Safari and Firefox ignores the specified color and width in this example: data:text/html,<div style="outline:auto red 10px;">hello</div>. Chrome applies the color but not the width. I consider that a bug in Chrome (it shouldn't apply the color if it supports outline-style:auto on the given platform).

(NOTE: Firefox doesn't support outline-style:auto by default yet. You have to toggle the hidden pref layout.css.outline-style-auto.enabled to true to enable it. It will be on by default in Nightly soon though.)

[BillGoldstein]

It will be on by default in Nightly soon

Actually, it's on by default as of today.
https://bugzilla.mozilla.org/show_bug.cgi?id=1031664

I think I agree with Mats (and Emilio) as to how it should act; just think there should be spec text making it explicit.

Background info: https://bugzilla.mozilla.org/show_bug.cgi?id=1609195

[mrego]

There's already the following text on the spec:

To the extent that the outline follows the border edge, it should follow the border-radius curve.

It's not mandatory, but it says it should follow the border-radius.
The section that talks about outline-style: auto mentions that the outline-color might be used or not, but doesn't talk about the border-radius thing.

Also there are bugs in Chromium and WebKit about outline not following border-radius:

• https://bugs.chromium.org/p/chromium/issues/detail?id=81556
• https://bugs.webkit.org/show_bug.cgi?id=20807

The outline doesn't follow border-radius in the following example (same behavior in Chromium, Firefox and WebKit):
data:text/html,<style>div{outline: solid thick magenta; border: solid thick cyan; width: 200px; height: 200px; border-radius: 50px;}</style><div></div>

However, it follows border-radius only on WebKit and Mac (not in other platforms or Chromium or Firefox) if you use outline-style: auto :
data:text/html,<style>div{outline: auto thick magenta; border: solid thick cyan; width: 200px; height: 200px; border-radius: 50px;}</style><div></div>

[SebastianZ]

it's on by default as of today

@BillGoldstein, it doesn't appear to be, else I'd see quite a different appearance by default:

@RokeJulianLockhart What @BillGoldstein and @MatsPalmgren meant was that the implementation of the auto value in Firefox got enabled back in 2020, not that auto became the initial value of outline-style. The initial value of outline-style is still none.

Sebastian