Header

A page header component

$ npm install grommet-controlsimport { Header } from 'grommet-controls';<Header>  ...</Header>

	Status	Full name	Title	Time(ms)
Header.test.ts(6 tests)
	failed	Header > main	snapshot	102
	failed	Header > main	accessibility	275
	failed	Header > elevation	snapshot	50
	failed	Header > elevation	accessibility	303
	failed	Header > position	snapshot	24
	failed	Header > position	accessibility	117

total 6 tests

	Kind	Total	Covered	Skipped	%
Header.tsx
	lines	5	5	0	100%
	functions	1	1	0	100%
	statements	8	8	0	100%
	branches	0	0	0	100%

app title

impact

description

critical

image-alt

Ensures <img> elements have alternate text or a role of none or presentation...

	summary	target
	Fix any of the following: Element does not have an alt attribute aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"	.rah-static.rah-static--height-auto[aria-hidden="false"] > div > .css-154oin1[data-testid="story"] > .story-render-container.css-dhmrnb > .StyledGrommet-sc-19lkkz7-0.jXYINV > .dKUzmy.StyledBox-sc-13pk1d4-0

moderate

landmark-no-duplicate-banner

Ensures the document has at most one banner landmark...

	summary	target
	Fix any of the following: Document has more than one banner landmark	.rah-static.rah-static--height-auto[aria-hidden="false"] > div > .css-154oin1[data-testid="story"] > .story-render-container.css-dhmrnb > .StyledGrommet-sc-19lkkz7-0.jXYINV > .dKUzmy.StyledBox-sc-13pk1d4-0

320px

375px

768px

1024px