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:
undergroundwires
2023-12-11 05:24:27 +01:00
parent 916c9d62d9
commit a9851272ae
43 changed files with 1719 additions and 672 deletions

View File

@@ -1,4 +1,5 @@
import { SelectedScript } from '@/application/Context/State/Selection/Script/SelectedScript';
import { formatAssertionMessage } from '@tests/shared/FormatAssertionMessage';
export function expectEqualSelectedScripts(
actual: readonly SelectedScript[],
@@ -14,11 +15,11 @@ function expectSameScriptIds(
) {
const existingScriptIds = expected.map((script) => script.id).sort();
const expectedScriptIds = actual.map((script) => script.id).sort();
expect(existingScriptIds).to.deep.equal(expectedScriptIds, [
expect(existingScriptIds).to.deep.equal(expectedScriptIds, formatAssertionMessage([
'Unexpected script IDs.',
`Expected: ${expectedScriptIds.join(', ')}`,
`Actual: ${existingScriptIds.join(', ')}`,
].join('\n'));
]));
}
function expectSameRevertStates(
@@ -33,7 +34,7 @@ function expectSameRevertStates(
}
return script.revert !== other.revert;
});
expect(scriptsWithDifferentRevertStates).to.have.lengthOf(0, [
expect(scriptsWithDifferentRevertStates).to.have.lengthOf(0, formatAssertionMessage([
'Scripts with different revert states:',
scriptsWithDifferentRevertStates
.map((s) => [
@@ -42,5 +43,5 @@ function expectSameRevertStates(
`Expected revert state: "${expected.find((existing) => existing.id === s.id)?.revert ?? 'unknown'}"`,
].map((line) => `\t${line}`).join('\n'))
.join('\n---\n'),
].join('\n'));
]));
}