Hyvä replaces Luma's KnockoutJS/RequireJS/jQuery with Alpine.js + Tailwind CSS. Playwright's strict mode (rejects locators matching multiple elements) conflicts with Alpine.js DOM patterns where hidden elements exist throughout the page. This skill documents pitfalls and solutions discovered while writing Playwright tests for Hyvä storefronts.
Hyvä templates scatter elements like throughout the DOM. These are invisible but present, so a bare selector like .message.error matches both hidden and visible instances, causing Playwright strict mode violations.
Never use: bare .message, .message.error, .message.success, or div.message as selectors.
Scrivi test di drammaturgo per i temi Hyvä con i componenti Alpine.js. Questa abilità dovrebbe essere utilizzata durante la scrittura di test e2e, la creazione di oggetti di pagina o il debug di problemi di selezione nei test di Playwright per le vetrine Hyvä Magento. Le frasi trigger includono "scrivi test del drammaturgo", "drammaturgo alpino", "test pagina hyva", "test e2e", "selezionatore del drammaturgo". Fonte: hyva-themes/hyva-ai-tools.