Add support for screen.lock/unlock (#875)

Author: nshuba

integration-test/test-web-compat.js

@@ -80,7 +80,7 @@ describe('Ensure safari interface is injected', () => {
     })
 })
 
-describe('Ensure Notification and Permissions interface is injected', () => {
+describe('Ensure Notification interface is injected', () => {
     let browser
     let server
     let teardown
@@ -300,6 +300,167 @@ describe('Permissions API', () => {
     })
 })
 
+describe('ScreenOrientation API', () => {
+    let browser
+    let server
+    let teardown
+    let setupServer
+    let gotoAndWait
+    let port
+    let page
+    beforeAll(async () => {
+        ({ browser, setupServer, teardown, gotoAndWait } = await setup({ withExtension: true }))
+        server = setupServer()
+    })
+    afterAll(async () => {
+        await server?.close()
+        await teardown()
+    })
+
+    describe('disabled feature', () => {
+        async function checkLockThrows (orientation) {
+            const payload = `screen.orientation.lock(${JSON.stringify(orientation)})`
+            const result = await page.evaluate(payload).catch((e) => {
+                return { threw: e }
+            })
+            return result
+        }
+
+        it(' should not fix screenOrientation API', async () => {
+            port = server.address().port
+            page = await browser.newPage()
+
+            // no screenLock setting
+            await gotoAndWait(page, `http://localhost:${port}/blank.html`, { site: { enabledFeatures: ['webCompat'] } })
+            const result = await checkLockThrows('landscape')
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toEqual('screen.orientation.lock() is not available on this device.')
+        })
+    })
+
+    describe('enabled feature', () => {
+        let port
+        let page
+
+        beforeAll(async () => {
+            port = server.address().port
+            page = await browser.newPage()
+            await gotoAndWait(page, `http://localhost:${port}/blank.html`, {
+                site: {
+                    enabledFeatures: ['webCompat']
+                },
+                featureSettings: {
+                    webCompat: {
+                        screenLock: 'enabled'
+                    }
+                }
+            })
+        })
+
+        async function checkLock (orientation) {
+            const payload = `screen.orientation.lock(${JSON.stringify(orientation)})`
+            const result = await page.evaluate(payload).catch((e) => {
+                return { threw: e }
+            })
+            const message = await page.evaluate(() => {
+                return globalThis.lockReq
+            })
+            return { result, message }
+        }
+
+        async function checkUnlock () {
+            const payload = 'screen.orientation.unlock()'
+            const result = await page.evaluate(payload).catch((e) => {
+                return { threw: e }
+            })
+            const message = await page.evaluate(() => {
+                return globalThis.lockReq
+            })
+            return { result, message }
+        }
+
+        it('should err out when orientation not provided', async () => {
+            const { result } = await checkLock()
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain("Failed to execute 'lock' on 'ScreenOrientation': 1 argument required, but only 0 present")
+        })
+
+        it('should err out when orientation of unexpected type', async () => {
+            const { result } = await checkLock({})
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain('not a valid enum value of type OrientationLockType')
+        })
+
+        it('should err out when orientation of unexpected value', async () => {
+            const { result } = await checkLock('xxx')
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain('not a valid enum value of type OrientationLockType')
+        })
+
+        it('should propagate native TypeError', async () => {
+            await page.evaluate(() => {
+                globalThis.cssMessaging.impl.request = () => {
+                    return Promise.resolve({ failure: { name: 'TypeError', message: 'some error message' } })
+                }
+            })
+
+            const { result } = await checkLock('landscape')
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain('some error message')
+        })
+
+        it('should propagate native InvalidStateError', async () => {
+            await page.evaluate(() => {
+                globalThis.cssMessaging.impl.request = () => {
+                    return Promise.resolve({ failure: { name: 'InvalidStateError', message: 'some error message' } })
+                }
+            })
+
+            const { result } = await checkLock('landscape')
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain('some error message')
+        })
+
+        it('should propagate native default error', async () => {
+            await page.evaluate(() => {
+                globalThis.cssMessaging.impl.request = () => {
+                    return Promise.resolve({ failure: { name: 'xxx', message: 'some error message' } })
+                }
+            })
+
+            const { result } = await checkLock('landscape')
+            expect(result.threw).not.toBeUndefined()
+            expect(result.threw.message).toContain('some error message')
+        })
+
+        it('should fix screenOrientation API', async () => {
+            await page.evaluate(() => {
+                globalThis.cssMessaging.impl.request = (req) => {
+                    globalThis.lockReq = req
+                    return Promise.resolve({})
+                }
+            })
+
+            const { result, message } = await checkLock('landscape')
+            expect(result).toBeUndefined()
+            expect(message).toEqual(jasmine.objectContaining({ featureName: 'webCompat', method: 'screenLock', params: { orientation: 'landscape' } }))
+        })
+
+        it('should send message on unlock', async () => {
+            await page.evaluate(() => {
+                globalThis.cssMessaging.impl.request = (req) => {
+                    globalThis.lockReq = req
+                    return Promise.resolve({})
+                }
+            })
+
+            const { result, message } = await checkUnlock()
+            expect(result).toBeUndefined()
+            expect(message).toEqual(jasmine.objectContaining({ featureName: 'webCompat', method: 'screenUnlock' }))
+        })
+    })
+})
+
 describe('Web Share API', () => {
     let browser
     let server

src/features/web-compat.js

@@ -14,6 +14,8 @@ function windowSizingFix () {
 
 const MSG_WEB_SHARE = 'webShare'
 const MSG_PERMISSIONS_QUERY = 'permissionsQuery'
+const MSG_SCREEN_LOCK = 'screenLock'
+const MSG_SCREEN_UNLOCK = 'screenUnlock'
 
 function canShare (data) {
     if (typeof data !== 'object') return false
@@ -69,6 +71,9 @@ export default class WebCompat extends ContentFeature {
     /** @type {Promise<any> | null} */
     #activeShareRequest = null
 
+    /** @type {Promise<any> | null} */
+    #activeScreenLockRequest = null
+
     init () {
         if (this.getFeatureSettingEnabled('windowSizing')) {
             windowSizingFix()
@@ -108,6 +113,10 @@ export default class WebCompat extends ContentFeature {
         if (this.getFeatureSettingEnabled('viewportWidth')) {
             this.viewportWidthFix()
         }
+
+        if (this.getFeatureSettingEnabled('screenLock')) {
+            this.screenLockFix()
+        }
     }
 
     /** Shim Web Share API in Android WebView */
@@ -283,6 +292,66 @@ export default class WebCompat extends ContentFeature {
         window.navigator.permissions = permissions
     }
 
+    /**
+     * Fixes screen lock/unlock APIs for Android WebView.
+     */
+    screenLockFix () {
+        const validOrientations = [
+            'any',
+            'natural',
+            'landscape',
+            'portrait',
+            'portrait-primary',
+            'portrait-secondary',
+            'landscape-primary',
+            'landscape-secondary',
+            'unsupported'
+        ]
+
+        this.wrapProperty(globalThis.ScreenOrientation.prototype, 'lock', {
+            value: async (requestedOrientation) => {
+                if (!requestedOrientation) {
+                    return Promise.reject(new TypeError("Failed to execute 'lock' on 'ScreenOrientation': 1 argument required, but only 0 present."))
+                }
+                if (!validOrientations.includes(requestedOrientation)) {
+                    return Promise.reject(new TypeError(`Failed to execute 'lock' on 'ScreenOrientation': The provided value '${requestedOrientation}' is not a valid enum value of type OrientationLockType.`))
+                }
+                if (this.#activeScreenLockRequest) {
+                    return Promise.reject(new DOMException('Screen lock already in progress', 'AbortError'))
+                }
+
+                this.#activeScreenLockRequest = this.messaging.request(MSG_SCREEN_LOCK, { orientation: requestedOrientation })
+                let resp
+                try {
+                    resp = await this.#activeScreenLockRequest
+                } catch (err) {
+                    throw new DOMException(err.message, 'DataError')
+                } finally {
+                    this.#activeScreenLockRequest = null
+                }
+
+                if (resp.failure) {
+                    switch (resp.failure.name) {
+                    case 'TypeError':
+                        return Promise.reject(new TypeError(resp.failure.message))
+                    case 'InvalidStateError':
+                        return Promise.reject(new DOMException(resp.failure.message, resp.failure.name))
+                    default:
+                        return Promise.reject(new DOMException(resp.failure.message, 'DataError'))
+                    }
+                }
+
+                return Promise.resolve()
+            }
+        })
+
+        this.wrapProperty(globalThis.ScreenOrientation.prototype, 'unlock', {
+            value: () => {
+                this.messaging.request(MSG_SCREEN_UNLOCK, {})
+            }
+        })
+    }
+
     /**
      * Add missing navigator.credentials API
      */