refactor(storybook): hide page headers and preserve accessibility
StoryPageHeader no longer shows the page title, kicker, description or the SW group notice; it renders only a visually hidden H1 with the Story title, so the preview keeps a page heading for screen readers while the first section starts at the top gutter (unchanged position). - OrgChart verify-p8 / p9 / p9-1 / p9-2-composition wait for the first visible StoryPage content block and read the page H1 instead of .sb-page-title; existing expectations are unchanged. - SW overview browser test clicks the page gutter as its outside-click target. - Drop the unused .sb-page-description from the SW Storybook hide rules. - Update the Storybook page frame rule in the project guideline.
This commit is contained in:
1 parent
f22428548a
commit
63b3ab010b
11 files changed
+59
-105
No files matched your search
@@ -161,7 +161,7 @@ try {
|
||||
await open('color','색상');await open('layer','레이어')
|
||||
check('opening another dropdown closes the previous one',await header.locator('.hm-sw-header__color-menu').count()===0&&await header.locator('.hm-sw-header__layer-panel').count()===1)
|
||||
await page.keyboard.press('Escape');check('Escape closes Header dropdown',await header.locator('.hm-sw-header__layer-panel').count()===0)
|
||||
await open('layer','레이어');await page.locator('.sb-page-title').click();check('outside click closes Header dropdown',await header.locator('.hm-sw-header__layer-panel').count()===0)
|
||||
await open('layer','레이어');await page.locator('.sb-page').click({position:{x:4,y:4}});check('outside click closes Header dropdown',await header.locator('.hm-sw-header__layer-panel').count()===0)
|
||||
|
||||
const barState=await page.locator('.hm-sw-property-bar').evaluate(bar=>({object:bar.querySelector('.hm-sw-property-bar__object').textContent,order:[...bar.querySelectorAll('[data-property-id]')].map(e=>e.dataset.propertyId),inputs:bar.querySelectorAll('input').length,focusable:[...bar.querySelectorAll('output')].filter(e=>e.tabIndex>=0).length,colors:[...new Set([...bar.querySelectorAll('output')].map(e=>getComputedStyle(e).color))]}))
|
||||
check('Bar: object text 원, order 반지름 / 지름 / 원주 / 면적, read-only red text (edited in the panel) without input or focus stop',barState.object==='원'&&barState.order.join()==='radius,diameter,circumference,area'&&barState.inputs===0&&barState.focusable===0&&barState.colors.join()==='rgb(230, 4, 3)',barState)
|
||||
|
||||
Reference in new issue
Block a user