Add can-lock-orientation CSS media feature by marcoscaceres · Pull Request #273 · w3c/screen-orientation

marcoscaceres · 2025-10-17T07:17:13Z

Implement can-lock-orientation media feature for Issue Add can-lock-orientation media feature to detect if locking is possible #206
Add privacy considerations to prevent fingerprinting through user preferences
Include examples showing CSS and JavaScript usage
Update abstract to mention CSS media features

Closes #206

The following tasks have been completed:

Modified Web platform tests (link to pull request)

Implementation commitment:

WebKit (https://bugs.webkit.org/enter_bug.cgi)
Chromium (https://bugs.chromium.org/p/chromium/issues/detail?id=)
Gecko (https://bugzilla.mozilla.org/show_bug.cgi?id=)

Preview | Diff

Copilot

Pull Request Overview

This PR adds a new CSS media feature can-lock-orientation that enables feature detection for screen orientation locking capabilities. The addition allows developers to conditionally style or display UI elements based on whether orientation locking is available in the current context.

Adds can-lock-orientation media feature with none and auto values
Includes privacy considerations to prevent fingerprinting through user preferences
Updates the abstract to reflect the new CSS integration

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

index.html

- Implement can-lock-orientation media feature for Issue #206 - Add privacy considerations to prevent fingerprinting through user preferences - Include examples showing CSS and JavaScript usage - Update abstract to mention CSS media features Fixes #206

Copilot

Pull Request Overview

Copilot reviewed 1 out of 1 changed files in this pull request and generated 2 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

index.html

Copilot

Pull Request Overview

Copilot reviewed 1 out of 1 changed files in this pull request and generated 1 comment.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

index.html

Copilot

Pull Request Overview

Copilot reviewed 1 out of 1 changed files in this pull request and generated no new comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

emilio · 2025-11-11T08:17:30Z

Why is this a media feature out of curiosity? Feels rather odd, is there any precedent for these can-*?

marcoscaceres · 2025-11-11T10:15:15Z

@emilio, it's where we landed with:
#206

But yes, the name is terrible.

Copilot

Pull request overview

Copilot reviewed 1 out of 1 changed files in this pull request and generated 4 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2025-11-26T02:07:39Z

index.html

+        multiple screen orientations, working alongside CSS. 
+        The API restricts locking the screen orientation
+        only if certain [=pre-lock conditions=] are met. 
+        This API particularly useful for applications such as


Missing word "is" before "particularly useful". Should be "This API is particularly useful for applications..."

Suggested change

This API particularly useful for applications such as

This API is particularly useful for applications such as

Copilot · 2025-11-26T02:07:40Z

index.html

+        <p>
+          The <a>can-lock-orientation</a> media feature can be used to test
+          whether the user agent supports screen orientation locking
+          functionality.
+        </p>


[nitpick] These lines appear redundant with the initial description at lines 917-921. The description "The can-lock-orientation media feature can be used to test whether the user agent supports screen orientation locking functionality" repeats the same information as "used to query whether the user agent supports locking the screen orientation in the current context." Consider removing this paragraph to avoid redundancy.

Suggested change

<p>

The <a>can-lock-orientation</a> media feature can be used to test

whether the user agent supports screen orientation locking

functionality.

</p>

Copilot · 2025-11-26T02:07:40Z

index.html

+            <ul>
+              <li>The user agent does not implement the Screen Orientation API
+              </li>
+              <li>The document is not [=Document/fully active=]


The condition "The document is not [=Document/fully active=]" is less specific than the actual check performed by the API. According to the common safety checks (line 487-490), the API checks if the document is a "fully active descendant of a top-level traversable with user attention", not just "fully active". Consider updating this to match the actual API requirement to ensure consistency and accuracy.

Suggested change

<li>The document is not [=Document/fully active=]

<li>The document is not a [=Document/fully active=] descendant of a top-level traversable with user attention

Copilot · 2025-11-26T02:07:41Z

index.html

+        This API particularly useful for applications such as
+        computer games, where users physically rotate the device, but the
+        screen orientation itself should not change. The specification also
+        defines CSS media features to enable feature detection of orientation


[nitpick] The text uses the plural "CSS media features" but only one media feature (can-lock-orientation) is being defined in this specification. Consider using the singular "CSS media feature" for accuracy, or if multiple features are planned, this is fine as is.

Suggested change

defines CSS media features to enable feature detection of orientation

defines a CSS media feature to enable feature detection of orientation

marcoscaceres mentioned this pull request Oct 17, 2025

TPAC 2025 status report #258

Closed

marcoscaceres requested a review from Copilot October 17, 2025 07:31

Copilot AI reviewed Oct 17, 2025

View reviewed changes

index.html Outdated Show resolved Hide resolved

index.html Outdated Show resolved Hide resolved

marcoscaceres added 2 commits October 17, 2025 15:32

fixup mediaqueries-5 xref

b76a334

marcoscaceres force-pushed the add-css-media-feature-206 branch from ea01973 to b76a334 Compare October 17, 2025 07:33

fixup

82353cc

marcoscaceres requested a review from Copilot October 28, 2025 07:08

Copilot AI reviewed Oct 28, 2025

View reviewed changes

index.html Outdated Show resolved Hide resolved

index.html Show resolved Hide resolved

Fix use of boolean context

b4e9430

marcoscaceres requested a review from Copilot October 28, 2025 08:57

Copilot AI reviewed Oct 28, 2025

View reviewed changes

index.html Outdated Show resolved Hide resolved

fix markup

3208037

marcoscaceres requested a review from Copilot October 28, 2025 09:12

Copilot AI reviewed Oct 28, 2025

View reviewed changes

Merge branch 'gh-pages' into add-css-media-feature-206

45b5ee3

marcoscaceres requested a review from Copilot November 26, 2025 02:04

Copilot started reviewing on behalf of marcoscaceres November 26, 2025 02:04 View session

Copilot finished reviewing on behalf of marcoscaceres November 26, 2025 02:07

Copilot AI reviewed Nov 26, 2025

View reviewed changes

	This API particularly useful for applications such as
	This API is particularly useful for applications such as

	<li>The document is not [=Document/fully active=]
	<li>The document is not a [=Document/fully active=] descendant of a top-level traversable with user attention

	defines CSS media features to enable feature detection of orientation
	defines a CSS media feature to enable feature detection of orientation

Conversation

marcoscaceres commented Oct 17, 2025 • edited by pr-preview bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

emilio commented Nov 11, 2025

Uh oh!

marcoscaceres commented Nov 11, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Copilot AI Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Nov 26, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

marcoscaceres commented Oct 17, 2025 •

edited by pr-preview bot

Loading