mirror of
https://github.com/fsolla/teqo.git
synced 2026-11-13 15:13:07 +00:00
e835108324
Regra CSS única em styles.css — @media (pointer: coarse) and (hover: none) + [data-theme='campaign'] :is(input, select, textarea, [contenteditable]) a 16px (limiar do Safari iOS). Cobre omnibox B127, Command search, native-select e textareas em qualquer orientação do iPhone; desktop intocado. E2E campaignIosInputZoom: emulação iPhone 13 pina 16px na omnibox de /campanha/municipios; control desktop pina 14px. Closes #501
55 lines
2.4 KiB
TypeScript
55 lines
2.4 KiB
TypeScript
import { devices, type Page } from '@playwright/test'
|
|
|
|
import { expect, test } from './fixtures/campaignE2EFixtures.js'
|
|
|
|
const municipalityOmnibox = (page: Page) =>
|
|
page.getByRole('combobox', { name: 'Filtrar municípios' })
|
|
|
|
const omniboxFontSize = (page: Page) =>
|
|
municipalityOmnibox(page).evaluate((element) => getComputedStyle(element).fontSize)
|
|
|
|
/**
|
|
* B183 — Safari iOS auto-zooms any focused form control whose computed
|
|
* font-size is below 16px, and a standalone PWA does not always restore the
|
|
* scale when the keyboard closes. The fix is one CSS rule for touch phones
|
|
* (`(pointer: coarse) and (hover: none)`), so these specs pin the computed
|
|
* size contract: 16px on a touch device, unchanged 14px on desktop.
|
|
*/
|
|
test.describe('B183 — inputs no touch ficam no limiar de 16px do auto-zoom iOS', () => {
|
|
// The project pins Desktop Chromium, so spread only the mobile-emulation
|
|
// bits of the iPhone descriptor (its `defaultBrowserType: 'webkit'` would
|
|
// force a new worker inside a describe group).
|
|
test.use({
|
|
userAgent: devices['iPhone 13'].userAgent,
|
|
viewport: devices['iPhone 13'].viewport,
|
|
deviceScaleFactor: devices['iPhone 13'].deviceScaleFactor,
|
|
isMobile: devices['iPhone 13'].isMobile,
|
|
hasTouch: devices['iPhone 13'].hasTouch,
|
|
})
|
|
|
|
test('omnibox de municípios computa 16px em dispositivo touch', async ({ campaign, page }) => {
|
|
const coordinator = await campaign.fixtures.createCampaignUser('coordinator', {
|
|
name: campaign.fixtures.value('Coordenadora touch'),
|
|
})
|
|
await campaign.login(page, coordinator.email!, coordinator.password)
|
|
await page.goto(`${campaign.baseURL}/campanha/municipios`)
|
|
|
|
const omnibox = municipalityOmnibox(page)
|
|
await expect(omnibox).toBeVisible()
|
|
await expect.poll(() => omniboxFontSize(page)).toBe('16px')
|
|
})
|
|
})
|
|
|
|
test.describe('B183 — desktop preserva o tamanho atual', () => {
|
|
test('omnibox de municípios continua em 14px', async ({ campaign, page }) => {
|
|
const coordinator = await campaign.fixtures.createCampaignUser('coordinator', {
|
|
name: campaign.fixtures.value('Coordenadora desktop'),
|
|
})
|
|
await campaign.login(page, coordinator.email!, coordinator.password)
|
|
await page.goto(`${campaign.baseURL}/campanha/municipios`)
|
|
|
|
const omnibox = municipalityOmnibox(page)
|
|
await expect(omnibox).toBeVisible()
|
|
await expect.poll(() => omniboxFontSize(page)).toBe('14px')
|
|
})
|
|
})
|