Skip to content

Improve accuracy in determining visibility state #4120

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.

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

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 13 additions & 3 deletions src/_internal/utils/web-preset.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import type { ProviderConfiguration } from '../types'
import { isWindowDefined, isDocumentDefined } from './helper'
import { isUndefined, noop } from './shared'
import { noop } from './shared'

/**
* Due to the bug https://bugs.chromium.org/p/chromium/issues/detail?id=678075,
Expand All @@ -22,8 +22,18 @@ const [onWindowEvent, offWindowEvent] =
: [noop, noop]

const isVisible = () => {
const visibilityState = isDocumentDefined && document.visibilityState
return isUndefined(visibilityState) || visibilityState !== 'hidden'
if (!isDocumentDefined) return true

try {
const isDocVisible = document.visibilityState !== 'hidden'

const isDocFocused =
typeof document.hasFocus === 'function' ? document.hasFocus() : true

return isDocVisible && isDocFocused
} catch (err) {
return true
}
}

const initFocus = (callback: () => void) => {
Expand Down
56 changes: 56 additions & 0 deletions test/unit/web-preset-visible.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import { describe, expect, it, beforeEach, afterEach } from 'vitest'

Check failure on line 1 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot find module 'vitest' or its corresponding type declarations.
import { preset } from '../../src/_internal/utils/web-preset'

describe('web-preset isVisible', () => {
let originalDocument: any

beforeEach(() => {
originalDocument = global.document
global.document = {

Check failure on line 9 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Type '{ visibilityState: "visible"; hasFocus: () => true; }' is missing the following properties from type 'Document': URL, alinkColor, all, anchors, and 248 more.
visibilityState: 'visible',
hasFocus: () => true
}
})

afterEach(() => {
global.document = originalDocument
})

it('returns true when document is visible and focused', () => {
global.document.visibilityState = 'visible'

Check failure on line 20 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot assign to 'visibilityState' because it is a read-only property.
global.document.hasFocus = () => true
expect(preset.isVisible()).toBe(true)
})

it('returns false when document is hidden and not focused', () => {
global.document.visibilityState = 'hidden'

Check failure on line 26 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot assign to 'visibilityState' because it is a read-only property.
global.document.hasFocus = () => false
expect(preset.isVisible()).toBe(false)
})

it('returns false when document is hidden but focused', () => {
global.document.visibilityState = 'hidden'

Check failure on line 32 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot assign to 'visibilityState' because it is a read-only property.
global.document.hasFocus = () => true
expect(preset.isVisible()).toBe(false)
})

it('returns false when document is visible but not focused', () => {
global.document.visibilityState = 'visible'

Check failure on line 38 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot assign to 'visibilityState' because it is a read-only property.
global.document.hasFocus = () => false
expect(preset.isVisible()).toBe(false)
})

it('returns true if hasFocus is not a function', () => {
global.document.visibilityState = 'visible'

Check failure on line 44 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Cannot assign to 'visibilityState' because it is a read-only property.
// @ts-expect-error

Check failure on line 45 in test/unit/web-preset-visible.test.ts

View workflow job for this annotation

GitHub Actions / test

Unused '@ts-expect-error' directive.
global.document.hasFocus = undefined
expect(preset.isVisible()).toBe(true)
})

it('returns true if there is an exception', () => {
Object.defineProperty(global, 'document', {
get() { throw new Error('Simulated error') }
})
expect(preset.isVisible()).toBe(true)
})
})
Loading