Fix touch state not being activated in iOS Safari
This commit resolves the issue with the `:active` pseudo-class not
activating in mobile Safari on iOS devices. It introduces a workaround
specifically for mobile Safari on iOS/iPadOS to enable the `:active`
pseudo-class. This ensures a consistent and responsive user interface
in response to touch states on mobile Safari.
Other supporting changes:
- Introduce new test utility functions such as `createWindowEventSpies`
and `formatAssertionMessage` to improve code reusability and
maintainability.
- Improve browser detection:
- Add detection for iPadOS and Windows 10 Mobile.
- Add touch support detection to correctly determine iPadOS vs macOS.
- Fix misidentification of some Windows 10 Mobile platforms as Windows
Phone.
- Improve test coverage and refactor tests.
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
import { describe, it, expect } from 'vitest';
|
||||
import { OperatingSystem } from '@/domain/OperatingSystem';
|
||||
import { ConditionBasedOsDetector } from '@/infrastructure/RuntimeEnvironment/BrowserOs/ConditionBasedOsDetector';
|
||||
import { BrowserEnvironment } from '@/infrastructure/RuntimeEnvironment/BrowserOs/BrowserOsDetector';
|
||||
import { formatAssertionMessage } from '@tests/shared/FormatAssertionMessage';
|
||||
import { BrowserOsTestCases } from './BrowserOsTestCases';
|
||||
|
||||
describe('ConditionBasedOsDetector', () => {
|
||||
describe('detect', () => {
|
||||
it('detects as expected', () => {
|
||||
BrowserOsTestCases.forEach((testCase) => {
|
||||
// arrange
|
||||
const sut = new ConditionBasedOsDetector();
|
||||
const environment: BrowserEnvironment = {
|
||||
userAgent: testCase.userAgent,
|
||||
isTouchSupported: testCase.platformTouchSupport,
|
||||
};
|
||||
// act
|
||||
const actual = sut.detect(environment);
|
||||
// assert
|
||||
expect(actual).to.equal(testCase.expectedOs, formatAssertionMessage([
|
||||
`Expected: "${OperatingSystem[testCase.expectedOs]}"`,
|
||||
`Actual: "${actual === undefined ? 'undefined' : OperatingSystem[actual]}"`,
|
||||
`User agent: "${testCase.userAgent}"`,
|
||||
`Touch support: "${testCase.platformTouchSupport ? 'Yes, supported' : 'No, unsupported.'}"`,
|
||||
]));
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user