Back to Accessibility Report

Axe-core® Accessibility Results

axe-core found 29 violations

# Description Axe rule ID WCAG Impact Count
1 ARIA role should be appropriate for the element aria-allowed-role Best practice minor 6
2 All page content should be contained by landmarks region Best practice moderate 19
3 [role="img"] elements must have an alternative text role-img-alt WCAG 2 Level A, WCAG 1.1.1 serious 4

Failed

1. ARIA role should be appropriate for the element

Learn more

aria-allowed-role

Best practice

Ensure role attribute has an appropriate value for the element

minor

Issue Tags: cat.aria best-practice

# Issue Description To solve this violation, you need to...
1

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(1) > .SingleFlavorBlock-module-active-v5G6l.SingleFlavorBlock-module-block-eisWm.undefined

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined SingleFlavorBlock-module-active-v5G6l" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element
2

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(2) > .SingleFlavorBlock-module-block-eisWm.undefined[data-testid="single-flavor-stick-block"]

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element
3

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(3) > .SingleFlavorBlock-module-block-eisWm.undefined[data-testid="single-flavor-stick-block"]

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element
4

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(4) > .SingleFlavorBlock-module-block-eisWm.undefined[data-testid="single-flavor-stick-block"]

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element
5

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(5) > .SingleFlavorBlock-module-block-eisWm.undefined[data-testid="single-flavor-stick-block"]

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element
6

Element location

.Drawer-module-drawerBody-e4Tqm > .SingleFlavorSelector-module-sticksList-e9jte > li:nth-child(6) > .SingleFlavorBlock-module-block-eisWm.undefined[data-testid="single-flavor-stick-block"]

Element source

<section class="SingleFlavorBlock-module-block-eisWm undefined" data-testid="single-flavor-stick-block" role="button" tabindex="0" aria-disabled="false">

Fix any of the following:

  • ARIA role button is not allowed for given element

2. All page content should be contained by landmarks

Learn more

region

Best practice

Ensure all page content is contained by landmarks

moderate

Issue Tags: cat.keyboard best-practice

# Issue Description To solve this violation, you need to...
1

Element location

.swiper-watch-progress

Element source

<div class="swiper swiper-container swiper-initialized swiper-horizontal swiper-watch-progress aem-carousel__galleryThumbs swiper-backface-hidden swiper-thumbs">

Fix any of the following:

  • Some page content is not contained by landmarks
2

Element location

.aem-productDetails__productInfo > div:nth-child(1)

Element source

<div><h1 class="Typography-module-variant-h1-By2x0 Typography-module-font-weight-regular-yJHDk ProductHeading-module-title-u3xnP">Consumables Camel Bronze - Carton</h1></div>

Fix any of the following:

  • Some page content is not contained by landmarks
3

Element location

fieldset[data-testid="packaging-options"] > legend

Element source

<legend class="ConsumablesFormStepSection-module-title-rBthc"><div class="ConsumablesSectionTitle-module-stepCountContent-moRTC"><strong class="ConsumablesSectionTitle-module-stepCountLabel-+sIlP">Step 1</strong> Select your preferred format</div></legend>

Fix any of the following:

  • Some page content is not contained by landmarks
4

Element location

label[for=":re:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":re:">

Fix any of the following:

  • Some page content is not contained by landmarks
5

Element location

label[for=":rf:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rf:">

Fix any of the following:

  • Some page content is not contained by landmarks
6

Element location

label[for=":rg:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rg:">

Fix any of the following:

  • Some page content is not contained by landmarks
7

Element location

label[for=":rh:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rh:">

Fix any of the following:

  • Some page content is not contained by landmarks
8

Element location

fieldset[data-testid="consumables-flavor-selector"] > legend

Element source

<legend class="ConsumablesFormStepSection-module-title-rBthc"><div class="ConsumablesSectionTitle-module-stepCountContent-moRTC"><strong class="ConsumablesSectionTitle-module-stepCountLabel-+sIlP">Step 2</strong> Select your flavors</div></legend>

Fix any of the following:

  • Some page content is not contained by landmarks
9

Element location

.Drawer-module-drawerHeadline-l85Yh

Element source

<div class="Drawer-module-drawerHeadline-l85Yh">Flavour selector</div>

Fix any of the following:

  • Some page content is not contained by landmarks
10

Element location

fieldset[data-testid="quantity-selection-step"] > legend

Element source

<legend class="ConsumablesFormStepSection-module-title-rBthc"><div class="ConsumablesSectionTitle-module-stepCountContent-moRTC"><strong class="ConsumablesSectionTitle-module-stepCountLabel-+sIlP">Step 3</strong> Select your desired quantity</div></legend>

Fix any of the following:

  • Some page content is not contained by landmarks
11

Element location

label[for=":ri:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":ri:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">1 cartons (<span>200 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
12

Element location

label[for=":rj:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rj:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">2 cartons (<span>400 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
13

Element location

label[for=":rk:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rk:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">3 cartons (<span>600 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
14

Element location

label[for=":rl:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rl:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">4 cartons (<span>800 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
15

Element location

label[for=":rm:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rm:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">5 cartons (<span>1000 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
16

Element location

label[for=":rn:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rn:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">6 cartons (<span>1200 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
17

Element location

label[for=":ro:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":ro:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">7 cartons (<span>1400 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
18

Element location

label[for=":rp:"]

Element source

<label class="RadioCard-module-radioLabel-42+t-" for=":rp:"><div class="RadioCard-module-radioBox-kG9oe"><div class="RadioCard-module-radioTitleBox-UTZKQ"><span class="RadioCard-module-radioTitle-0ov2c">8 cartons (<span>1600 sticks</span>)</span></div></div></label>

Fix any of the following:

  • Some page content is not contained by landmarks
19

Element location

.product-information-block

Element source

<div class="product-information-block">

Fix any of the following:

  • Some page content is not contained by landmarks

3. [role="img"] elements must have an alternative text

Learn more

role-img-alt

WCAG 2 Level A, WCAG 1.1.1

Ensure [role="img"] elements have alternative text

serious

Issue Tags: cat.text-alternatives wcag2a wcag111 section508 section508.22.a TTv5 TT7.a EN-301-549 EN-9.1.1.1 ACT

# Issue Description To solve this violation, you need to...
1

Element location

label[for=":re:"] > .RadioCard-module-radioBox-kG9oe > .RadioCard-module-radioIcon-no7c7 > .Image-module-container-0Cw8H.ConsumablesPackagingFormatSection-module-icon-LdNyE[role="img"]

Element source

<div class="Image-module-container-0Cw8H ConsumablesPackagingFormatSection-module-icon-LdNyE" role="img" style="background-image: url(&quot;https://m24-fe1.dev-jtides.com/media/jti_selector_matrix/icons/Screenshot_2025-05-14_at_14.55.58.png&quot;);"></div>

Fix any of the following:

  • 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
2

Element location

label[for=":rf:"] > .RadioCard-module-radioBox-kG9oe > .RadioCard-module-radioIcon-no7c7 > .Image-module-container-0Cw8H.ConsumablesPackagingFormatSection-module-icon-LdNyE[role="img"]

Element source

<div class="Image-module-container-0Cw8H ConsumablesPackagingFormatSection-module-icon-LdNyE" role="img" style="background-image: url(&quot;https://m24-fe1.dev-jtides.com/media/jti_selector_matrix/icons/Screenshot_2025-05-14_at_14.56.05.png&quot;);"></div>

Fix any of the following:

  • 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
3

Element location

label[for=":rg:"] > .RadioCard-module-radioBox-kG9oe > .RadioCard-module-radioIcon-no7c7 > .Image-module-container-0Cw8H.ConsumablesPackagingFormatSection-module-icon-LdNyE[role="img"]

Element source

<div class="Image-module-container-0Cw8H ConsumablesPackagingFormatSection-module-icon-LdNyE" role="img" style="background-image: url(&quot;https://m24-fe1.dev-jtides.com/media/jti_selector_matrix/icons/Screenshot_2025-05-14_at_14.56.15_1.png&quot;);"></div>

Fix any of the following:

  • 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
4

Element location

label[for=":rh:"] > .RadioCard-module-radioBox-kG9oe > .RadioCard-module-radioIcon-no7c7 > .Image-module-container-0Cw8H.ConsumablesPackagingFormatSection-module-icon-LdNyE[role="img"]

Element source

<div class="Image-module-container-0Cw8H ConsumablesPackagingFormatSection-module-icon-LdNyE" role="img" style="background-image: url(&quot;https://m24-fe1.dev-jtides.com/media/jti_selector_matrix/icons/Screenshot_2025-05-14_at_14.56.10_1.png&quot;);"></div>

Fix any of the following:

  • 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