html-elms.js 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932
  1. // Source: https://www.w3.org/TR/html-aria/#allowed-aria-roles-states-and-properties
  2. // Source: https://www.w3.org/TR/html-aam-1.0/#html-element-role-mappings
  3. // Source https://html.spec.whatwg.org/multipage/dom.html#content-models
  4. // Source https://dom.spec.whatwg.org/#dom-element-attachshadow
  5. const htmlElms = {
  6. a: {
  7. // Note: variants work by matching the node against the
  8. // `matches` attribute. if the variant matches AND has the
  9. // desired property (contentTypes, etc.) then we use it,
  10. // otherwise we move on to the next matching variant
  11. variant: {
  12. href: {
  13. matches: '[href]',
  14. contentTypes: ['interactive', 'phrasing', 'flow'],
  15. allowedRoles: [
  16. 'button',
  17. 'checkbox',
  18. 'menuitem',
  19. 'menuitemcheckbox',
  20. 'menuitemradio',
  21. 'option',
  22. 'radio',
  23. 'switch',
  24. 'tab',
  25. 'treeitem',
  26. 'doc-backlink',
  27. 'doc-biblioref',
  28. 'doc-glossref',
  29. 'doc-noteref'
  30. ],
  31. namingMethods: ['subtreeText']
  32. },
  33. // Note: the default variant is a special variant and is
  34. // used as the last match if none of the other variants
  35. // match or have the desired attribute
  36. default: {
  37. contentTypes: ['phrasing', 'flow'],
  38. allowedRoles: true
  39. }
  40. }
  41. },
  42. abbr: {
  43. contentTypes: ['phrasing', 'flow'],
  44. allowedRoles: true
  45. },
  46. addres: {
  47. contentTypes: ['flow'],
  48. allowedRoles: true
  49. },
  50. area: {
  51. contentTypes: ['phrasing', 'flow'],
  52. allowedRoles: false,
  53. namingMethods: ['altText']
  54. },
  55. article: {
  56. contentTypes: ['sectioning', 'flow'],
  57. allowedRoles: [
  58. 'feed',
  59. 'presentation',
  60. 'none',
  61. 'document',
  62. 'application',
  63. 'main',
  64. 'region'
  65. ],
  66. shadowRoot: true
  67. },
  68. aside: {
  69. contentTypes: ['sectioning', 'flow'],
  70. allowedRoles: [
  71. 'feed',
  72. 'note',
  73. 'presentation',
  74. 'none',
  75. 'region',
  76. 'search',
  77. 'doc-dedication',
  78. 'doc-example',
  79. 'doc-footnote',
  80. 'doc-pullquote',
  81. 'doc-tip'
  82. ]
  83. },
  84. audio: {
  85. variant: {
  86. controls: {
  87. matches: '[controls]',
  88. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow']
  89. },
  90. default: {
  91. contentTypes: ['embedded', 'phrasing', 'flow']
  92. }
  93. },
  94. // Note: if the property applies regardless of variants it is
  95. // placed at the top level instead of the default variant
  96. allowedRoles: ['application'],
  97. chromiumRole: 'Audio'
  98. },
  99. b: {
  100. contentTypes: ['phrasing', 'flow'],
  101. allowedRoles: false
  102. },
  103. base: {
  104. allowedRoles: false,
  105. noAriaAttrs: true
  106. },
  107. bdi: {
  108. contentTypes: ['phrasing', 'flow'],
  109. allowedRoles: true
  110. },
  111. bdo: {
  112. contentTypes: ['phrasing', 'flow'],
  113. allowedRoles: true
  114. },
  115. blockquote: {
  116. contentTypes: ['flow'],
  117. allowedRoles: true,
  118. shadowRoot: true
  119. },
  120. body: {
  121. allowedRoles: false,
  122. shadowRoot: true
  123. },
  124. br: {
  125. contentTypes: ['phrasing', 'flow'],
  126. allowedRoles: ['presentation', 'none'],
  127. namingMethods: ['titleText', 'singleSpace']
  128. },
  129. button: {
  130. contentTypes: ['interactive', 'phrasing', 'flow'],
  131. allowedRoles: [
  132. 'checkbox',
  133. 'link',
  134. 'menuitem',
  135. 'menuitemcheckbox',
  136. 'menuitemradio',
  137. 'option',
  138. 'radio',
  139. 'switch',
  140. 'tab'
  141. ],
  142. // 5.4 button Element
  143. namingMethods: ['subtreeText']
  144. },
  145. canvas: {
  146. allowedRoles: true,
  147. contentTypes: ['embedded', 'phrasing', 'flow'],
  148. chromiumRole: 'Canvas'
  149. },
  150. caption: {
  151. allowedRoles: false
  152. },
  153. cite: {
  154. contentTypes: ['phrasing', 'flow'],
  155. allowedRoles: true
  156. },
  157. code: {
  158. contentTypes: ['phrasing', 'flow'],
  159. allowedRoles: true
  160. },
  161. col: {
  162. allowedRoles: false,
  163. noAriaAttrs: true
  164. },
  165. colgroup: {
  166. allowedRoles: false,
  167. noAriaAttrs: true
  168. },
  169. data: {
  170. contentTypes: ['phrasing', 'flow'],
  171. allowedRoles: true
  172. },
  173. datalist: {
  174. contentTypes: ['phrasing', 'flow'],
  175. allowedRoles: false,
  176. implicitAttrs: {
  177. // Note: even though the value of aria-multiselectable is based
  178. // on the attributes, we don't currently need to know the
  179. // precise value. however, this allows us to make the attribute
  180. // future proof in case we ever do need to know it
  181. 'aria-multiselectable': 'false'
  182. }
  183. },
  184. dd: {
  185. allowedRoles: false
  186. },
  187. del: {
  188. contentTypes: ['phrasing', 'flow'],
  189. allowedRoles: true
  190. },
  191. dfn: {
  192. contentTypes: ['phrasing', 'flow'],
  193. allowedRoles: true
  194. },
  195. details: {
  196. contentTypes: ['interactive', 'flow'],
  197. allowedRoles: false
  198. },
  199. dialog: {
  200. contentTypes: ['flow'],
  201. allowedRoles: ['alertdialog']
  202. },
  203. div: {
  204. contentTypes: ['flow'],
  205. allowedRoles: true,
  206. shadowRoot: true
  207. },
  208. dl: {
  209. contentTypes: ['flow'],
  210. allowedRoles: ['group', 'list', 'presentation', 'none'],
  211. chromiumRole: 'DescriptionList'
  212. },
  213. dt: {
  214. allowedRoles: ['listitem']
  215. },
  216. em: {
  217. contentTypes: ['phrasing', 'flow'],
  218. allowedRoles: true
  219. },
  220. embed: {
  221. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow'],
  222. allowedRoles: ['application', 'document', 'img', 'presentation', 'none'],
  223. chromiumRole: 'EmbeddedObject'
  224. },
  225. fieldset: {
  226. contentTypes: ['flow'],
  227. allowedRoles: ['none', 'presentation', 'radiogroup'],
  228. // 5.5 fieldset and legend Elements
  229. namingMethods: ['fieldsetLegendText']
  230. },
  231. figcaption: {
  232. allowedRoles: ['group', 'none', 'presentation']
  233. },
  234. figure: {
  235. contentTypes: ['flow'],
  236. // Note: technically you're allowed no role when a figcaption
  237. // descendant, but we can't match that so we'll go with any role
  238. allowedRoles: true,
  239. // 5.9 figure and figcaption Elements
  240. namingMethods: ['figureText', 'titleText']
  241. },
  242. footer: {
  243. contentTypes: ['flow'],
  244. allowedRoles: ['group', 'none', 'presentation', 'doc-footnote'],
  245. shadowRoot: true
  246. },
  247. form: {
  248. contentTypes: ['flow'],
  249. allowedRoles: ['search', 'none', 'presentation']
  250. },
  251. h1: {
  252. contentTypes: ['heading', 'flow'],
  253. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  254. shadowRoot: true,
  255. implicitAttrs: {
  256. 'aria-level': '1'
  257. }
  258. },
  259. h2: {
  260. contentTypes: ['heading', 'flow'],
  261. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  262. shadowRoot: true,
  263. implicitAttrs: {
  264. 'aria-level': '2'
  265. }
  266. },
  267. h3: {
  268. contentTypes: ['heading', 'flow'],
  269. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  270. shadowRoot: true,
  271. implicitAttrs: {
  272. 'aria-level': '3'
  273. }
  274. },
  275. h4: {
  276. contentTypes: ['heading', 'flow'],
  277. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  278. shadowRoot: true,
  279. implicitAttrs: {
  280. 'aria-level': '4'
  281. }
  282. },
  283. h5: {
  284. contentTypes: ['heading', 'flow'],
  285. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  286. shadowRoot: true,
  287. implicitAttrs: {
  288. 'aria-level': '5'
  289. }
  290. },
  291. h6: {
  292. contentTypes: ['heading', 'flow'],
  293. allowedRoles: ['none', 'presentation', 'tab', 'doc-subtitle'],
  294. shadowRoot: true,
  295. implicitAttrs: {
  296. 'aria-level': '6'
  297. }
  298. },
  299. head: {
  300. allowedRoles: false,
  301. noAriaAttrs: true
  302. },
  303. header: {
  304. contentTypes: ['flow'],
  305. allowedRoles: ['group', 'none', 'presentation', 'doc-footnote'],
  306. shadowRoot: true
  307. },
  308. hgroup: {
  309. contentTypes: ['heading', 'flow'],
  310. allowedRoles: true
  311. },
  312. hr: {
  313. contentTypes: ['flow'],
  314. allowedRoles: ['none', 'presentation', 'doc-pagebreak'],
  315. namingMethods: ['titleText', 'singleSpace']
  316. },
  317. html: {
  318. allowedRoles: false,
  319. noAriaAttrs: true
  320. },
  321. i: {
  322. contentTypes: ['phrasing', 'flow'],
  323. allowedRoles: true
  324. },
  325. iframe: {
  326. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow'],
  327. allowedRoles: ['application', 'document', 'img', 'none', 'presentation'],
  328. chromiumRole: 'Iframe'
  329. },
  330. img: {
  331. variant: {
  332. nonEmptyAlt: {
  333. matches: {
  334. attributes: {
  335. alt: '/.+/'
  336. }
  337. },
  338. allowedRoles: [
  339. 'button',
  340. 'checkbox',
  341. 'link',
  342. 'menuitem',
  343. 'menuitemcheckbox',
  344. 'menuitemradio',
  345. 'option',
  346. 'progressbar',
  347. 'scrollbar',
  348. 'separator',
  349. 'slider',
  350. 'switch',
  351. 'tab',
  352. 'treeitem',
  353. 'doc-cover'
  354. ]
  355. },
  356. usemap: {
  357. matches: '[usemap]',
  358. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow']
  359. },
  360. default: {
  361. // Note: allow role presentation and none on image with no
  362. // alt as a way to prevent axe from flagging the image as
  363. // needing an alt
  364. allowedRoles: ['presentation', 'none'],
  365. contentTypes: ['embedded', 'phrasing', 'flow']
  366. }
  367. },
  368. // 5.10 img Element
  369. namingMethods: ['altText']
  370. },
  371. input: {
  372. variant: {
  373. button: {
  374. matches: {
  375. properties: {
  376. type: 'button'
  377. }
  378. },
  379. allowedRoles: [
  380. 'link',
  381. 'menuitem',
  382. 'menuitemcheckbox',
  383. 'menuitemradio',
  384. 'option',
  385. 'radio',
  386. 'switch',
  387. 'tab'
  388. ]
  389. },
  390. // 5.2 input type="button", input type="submit" and input type="reset"
  391. buttonType: {
  392. matches: {
  393. properties: {
  394. type: ['button', 'submit', 'reset']
  395. }
  396. },
  397. namingMethods: ['valueText', 'titleText', 'buttonDefaultText']
  398. },
  399. checkboxPressed: {
  400. matches: {
  401. properties: {
  402. type: 'checkbox'
  403. },
  404. attributes: {
  405. 'aria-pressed': '/.*/'
  406. }
  407. },
  408. allowedRoles: ['button', 'menuitemcheckbox', 'option', 'switch'],
  409. implicitAttrs: {
  410. 'aria-checked': 'false'
  411. }
  412. },
  413. checkbox: {
  414. matches: {
  415. properties: {
  416. type: 'checkbox'
  417. },
  418. attributes: {
  419. 'aria-pressed': null
  420. }
  421. },
  422. allowedRoles: ['menuitemcheckbox', 'option', 'switch'],
  423. implicitAttrs: {
  424. 'aria-checked': 'false'
  425. }
  426. },
  427. noRoles: {
  428. matches: {
  429. properties: {
  430. // Note: types of url, search, tel, and email are listed
  431. // as not allowed roles however since they are text
  432. // types they should be allowed to have role=combobox
  433. type: [
  434. 'color',
  435. 'date',
  436. 'datetime-local',
  437. 'file',
  438. 'month',
  439. 'number',
  440. 'password',
  441. 'range',
  442. 'reset',
  443. 'submit',
  444. 'time',
  445. 'week'
  446. ]
  447. }
  448. },
  449. allowedRoles: false
  450. },
  451. hidden: {
  452. matches: {
  453. properties: {
  454. type: 'hidden'
  455. }
  456. },
  457. // Note: spec change (do not count as phrasing)
  458. contentTypes: ['flow'],
  459. allowedRoles: false,
  460. noAriaAttrs: true
  461. },
  462. image: {
  463. matches: {
  464. properties: {
  465. type: 'image'
  466. }
  467. },
  468. allowedRoles: [
  469. 'link',
  470. 'menuitem',
  471. 'menuitemcheckbox',
  472. 'menuitemradio',
  473. 'radio',
  474. 'switch'
  475. ],
  476. // 5.3 input type="image"
  477. namingMethods: [
  478. 'altText',
  479. 'valueText',
  480. 'labelText',
  481. 'titleText',
  482. 'buttonDefaultText'
  483. ]
  484. },
  485. radio: {
  486. matches: {
  487. properties: {
  488. type: 'radio'
  489. }
  490. },
  491. allowedRoles: ['menuitemradio'],
  492. implicitAttrs: {
  493. 'aria-checked': 'false'
  494. }
  495. },
  496. textWithList: {
  497. matches: {
  498. properties: {
  499. type: 'text'
  500. },
  501. attributes: {
  502. list: '/.*/'
  503. }
  504. },
  505. allowedRoles: false
  506. },
  507. default: {
  508. // Note: spec change (do not count as phrasing)
  509. contentTypes: ['interactive', 'flow'],
  510. allowedRoles: ['combobox', 'searchbox', 'spinbutton'],
  511. implicitAttrs: {
  512. 'aria-valuenow': ''
  513. },
  514. // 5.1 input type="text", input type="password", input type="search", input type="tel", input type="url"
  515. // 5.7 Other Form Elements
  516. namingMethods: ['labelText', 'placeholderText']
  517. }
  518. }
  519. },
  520. ins: {
  521. contentTypes: ['phrasing', 'flow'],
  522. allowedRoles: true
  523. },
  524. kbd: {
  525. contentTypes: ['phrasing', 'flow'],
  526. allowedRoles: true
  527. },
  528. label: {
  529. contentTypes: ['interactive', 'phrasing', 'flow'],
  530. allowedRoles: false,
  531. chromiumRole: 'Label'
  532. },
  533. legend: {
  534. allowedRoles: false
  535. },
  536. li: {
  537. allowedRoles: [
  538. 'menuitem',
  539. 'menuitemcheckbox',
  540. 'menuitemradio',
  541. 'option',
  542. 'none',
  543. 'presentation',
  544. 'radio',
  545. 'separator',
  546. 'tab',
  547. 'treeitem',
  548. 'doc-biblioentry',
  549. 'doc-endnote'
  550. ],
  551. implicitAttrs: {
  552. 'aria-setsize': '1',
  553. 'aria-posinset': '1'
  554. }
  555. },
  556. link: {
  557. contentTypes: ['phrasing', 'flow'],
  558. allowedRoles: false,
  559. noAriaAttrs: true
  560. },
  561. main: {
  562. contentTypes: ['flow'],
  563. allowedRoles: false,
  564. shadowRoot: true
  565. },
  566. map: {
  567. contentTypes: ['phrasing', 'flow'],
  568. allowedRoles: false,
  569. noAriaAttrs: true
  570. },
  571. math: {
  572. contentTypes: ['embedded', 'phrasing', 'flow'],
  573. allowedRoles: false
  574. },
  575. mark: {
  576. contentTypes: ['phrasing', 'flow'],
  577. allowedRoles: true
  578. },
  579. menu: {
  580. contentTypes: ['flow'],
  581. allowedRoles: [
  582. 'directory',
  583. 'group',
  584. 'listbox',
  585. 'menu',
  586. 'menubar',
  587. 'none',
  588. 'presentation',
  589. 'radiogroup',
  590. 'tablist',
  591. 'toolbar',
  592. 'tree'
  593. ]
  594. },
  595. meta: {
  596. variant: {
  597. itemprop: {
  598. matches: '[itemprop]',
  599. contentTypes: ['phrasing', 'flow']
  600. }
  601. },
  602. allowedRoles: false,
  603. noAriaAttrs: true
  604. },
  605. meter: {
  606. contentTypes: ['phrasing', 'flow'],
  607. allowedRoles: false,
  608. chromiumRole: 'progressbar'
  609. },
  610. nav: {
  611. contentTypes: ['sectioning', 'flow'],
  612. allowedRoles: ['doc-index', 'doc-pagelist', 'doc-toc'],
  613. shadowRoot: true
  614. },
  615. noscript: {
  616. contentTypes: ['phrasing', 'flow'],
  617. allowedRoles: false,
  618. noAriaAttrs: true
  619. },
  620. object: {
  621. variant: {
  622. usemap: {
  623. matches: '[usemap]',
  624. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow']
  625. },
  626. default: {
  627. contentTypes: ['embedded', 'phrasing', 'flow']
  628. }
  629. },
  630. allowedRoles: ['application', 'document', 'img'],
  631. chromiumRole: 'PluginObject'
  632. },
  633. ol: {
  634. contentTypes: ['flow'],
  635. allowedRoles: [
  636. 'directory',
  637. 'group',
  638. 'listbox',
  639. 'menu',
  640. 'menubar',
  641. 'none',
  642. 'presentation',
  643. 'radiogroup',
  644. 'tablist',
  645. 'toolbar',
  646. 'tree'
  647. ]
  648. },
  649. optgroup: {
  650. allowedRoles: false
  651. },
  652. option: {
  653. allowedRoles: false,
  654. implicitAttrs: {
  655. 'aria-selected': 'false'
  656. }
  657. },
  658. output: {
  659. contentTypes: ['phrasing', 'flow'],
  660. allowedRoles: true,
  661. // 5.6 output Element
  662. namingMethods: ['subtreeText']
  663. },
  664. p: {
  665. contentTypes: ['flow'],
  666. allowedRoles: true,
  667. shadowRoot: true
  668. },
  669. param: {
  670. allowedRoles: false,
  671. noAriaAttrs: true
  672. },
  673. picture: {
  674. contentTypes: ['embedded', 'phrasing', 'flow'],
  675. allowedRoles: false,
  676. noAriaAttrs: true
  677. },
  678. pre: {
  679. contentTypes: ['flow'],
  680. allowedRoles: true
  681. },
  682. progress: {
  683. contentTypes: ['phrasing', 'flow'],
  684. allowedRoles: true,
  685. implicitAttrs: {
  686. 'aria-valuemax': '100',
  687. 'aria-valuemin': '0',
  688. 'aria-valuenow': '0'
  689. }
  690. },
  691. q: {
  692. contentTypes: ['phrasing', 'flow'],
  693. allowedRoles: true
  694. },
  695. rp: {
  696. allowedRoles: true
  697. },
  698. rt: {
  699. allowedRoles: true
  700. },
  701. ruby: {
  702. contentTypes: ['phrasing', 'flow'],
  703. allowedRoles: true
  704. },
  705. s: {
  706. contentTypes: ['phrasing', 'flow'],
  707. allowedRoles: true
  708. },
  709. samp: {
  710. contentTypes: ['phrasing', 'flow'],
  711. allowedRoles: true
  712. },
  713. script: {
  714. contentTypes: ['phrasing', 'flow'],
  715. allowedRoles: false,
  716. noAriaAttrs: true
  717. },
  718. section: {
  719. contentTypes: ['sectioning', 'flow'],
  720. allowedRoles: [
  721. 'alert',
  722. 'alertdialog',
  723. 'application',
  724. 'banner',
  725. 'complementary',
  726. 'contentinfo',
  727. 'dialog',
  728. 'document',
  729. 'feed',
  730. 'log',
  731. 'main',
  732. 'marquee',
  733. 'navigation',
  734. 'none',
  735. 'note',
  736. 'presentation',
  737. 'search',
  738. 'status',
  739. 'tabpanel',
  740. 'doc-abstract',
  741. 'doc-acknowledgments',
  742. 'doc-afterword',
  743. 'doc-appendix',
  744. 'doc-bibliography',
  745. 'doc-chapter',
  746. 'doc-colophon',
  747. 'doc-conclusion',
  748. 'doc-credit',
  749. 'doc-credits',
  750. 'doc-dedication',
  751. 'doc-endnotes',
  752. 'doc-epigraph',
  753. 'doc-epilogue',
  754. 'doc-errata',
  755. 'doc-example',
  756. 'doc-foreword',
  757. 'doc-glossary',
  758. 'doc-index',
  759. 'doc-introduction',
  760. 'doc-notice',
  761. 'doc-pagelist',
  762. 'doc-part',
  763. 'doc-preface',
  764. 'doc-prologue',
  765. 'doc-pullquote',
  766. 'doc-qna',
  767. 'doc-toc'
  768. ],
  769. shadowRoot: true
  770. },
  771. select: {
  772. variant: {
  773. combobox: {
  774. matches: {
  775. attributes: {
  776. multiple: null,
  777. size: [null, '1']
  778. }
  779. },
  780. allowedRoles: ['menu']
  781. },
  782. default: {
  783. allowedRoles: false
  784. }
  785. },
  786. contentTypes: ['interactive', 'phrasing', 'flow'],
  787. implicitAttrs: {
  788. 'aria-valuenow': ''
  789. },
  790. // 5.7 Other form elements
  791. namingMethods: ['labelText']
  792. },
  793. slot: {
  794. contentTypes: ['phrasing', 'flow'],
  795. allowedRoles: false,
  796. noAriaAttrs: true
  797. },
  798. small: {
  799. contentTypes: ['phrasing', 'flow'],
  800. allowedRoles: true
  801. },
  802. source: {
  803. allowedRoles: false,
  804. noAriaAttrs: true
  805. },
  806. span: {
  807. contentTypes: ['phrasing', 'flow'],
  808. allowedRoles: true,
  809. shadowRoot: true
  810. },
  811. strong: {
  812. contentTypes: ['phrasing', 'flow'],
  813. allowedRoles: true
  814. },
  815. style: {
  816. allowedRoles: false,
  817. noAriaAttrs: true
  818. },
  819. svg: {
  820. contentTypes: ['embedded', 'phrasing', 'flow'],
  821. allowedRoles: ['application', 'document', 'img'],
  822. chromiumRole: 'SVGRoot',
  823. namingMethods: ['svgTitleText']
  824. },
  825. sub: {
  826. contentTypes: ['phrasing', 'flow'],
  827. allowedRoles: true
  828. },
  829. summary: {
  830. allowedRoles: false,
  831. // 5.8 summary Element
  832. namingMethods: ['subtreeText']
  833. },
  834. sup: {
  835. contentTypes: ['phrasing', 'flow'],
  836. allowedRoles: true
  837. },
  838. table: {
  839. contentTypes: ['flow'],
  840. allowedRoles: true,
  841. // 5.11 table Element
  842. namingMethods: ['tableCaptionText', 'tableSummaryText']
  843. },
  844. tbody: {
  845. allowedRoles: true
  846. },
  847. template: {
  848. contentTypes: ['phrasing', 'flow'],
  849. allowedRoles: false,
  850. noAriaAttrs: true
  851. },
  852. textarea: {
  853. contentTypes: ['interactive', 'phrasing', 'flow'],
  854. allowedRoles: false,
  855. implicitAttrs: {
  856. 'aria-valuenow': '',
  857. 'aria-multiline': 'true'
  858. },
  859. // 5.1 textarea
  860. namingMethods: ['labelText', 'placeholderText']
  861. },
  862. tfoot: {
  863. allowedRoles: true
  864. },
  865. thead: {
  866. allowedRoles: true
  867. },
  868. time: {
  869. contentTypes: ['phrasing', 'flow'],
  870. allowedRoles: true
  871. },
  872. title: {
  873. allowedRoles: false,
  874. noAriaAttrs: true
  875. },
  876. td: {
  877. allowedRoles: true
  878. },
  879. th: {
  880. allowedRoles: true
  881. },
  882. tr: {
  883. allowedRoles: true
  884. },
  885. track: {
  886. allowedRoles: false,
  887. noAriaAttrs: true
  888. },
  889. u: {
  890. contentTypes: ['phrasing', 'flow'],
  891. allowedRoles: true
  892. },
  893. ul: {
  894. contentTypes: ['flow'],
  895. allowedRoles: [
  896. 'directory',
  897. 'group',
  898. 'listbox',
  899. 'menu',
  900. 'menubar',
  901. 'none',
  902. 'presentation',
  903. 'radiogroup',
  904. 'tablist',
  905. 'toolbar',
  906. 'tree'
  907. ]
  908. },
  909. var: {
  910. contentTypes: ['phrasing', 'flow'],
  911. allowedRoles: true
  912. },
  913. video: {
  914. variant: {
  915. controls: {
  916. matches: '[controls]',
  917. contentTypes: ['interactive', 'embedded', 'phrasing', 'flow']
  918. },
  919. default: {
  920. contentTypes: ['embedded', 'phrasing', 'flow']
  921. }
  922. },
  923. allowedRoles: ['application'],
  924. chromiumRole: 'video'
  925. },
  926. wbr: {
  927. contentTypes: ['phrasing', 'flow'],
  928. allowedRoles: true
  929. }
  930. };
  931. export default htmlElms;