Skip to content

select: Fix a11y markup #1734

@tadatuta

Description

@tadatuta

Current select HTML generated with bem-xjst looks as follows (note uniq* occurrences):

<div class="select select_mode_radio-check select_theme_islands select_size_m i-bem" data-bem='{"select":{"name":"select3","text":"—"}}'>
    <input class="select__control" type="hidden" name="select3" value="2" />
    <button class="button button_size_m button_theme_islands button_checked button__control select__button i-bem" data-bem='{"button":{}}' role="listbox" type="button" aria-owns="uniq14492417126291 uniq14492417126291 uniq14492417126291" aria-labelledby="uniq14492417126292">
        <span class="button__text" id="uniq14492417126292">Мастер-класс</span>
        <span class="icon select__tick"></span>
    </button>
    <div class="popup popup_target_anchor popup_theme_islands popup_autoclosable i-bem" data-bem='{"popup":{"directions":["bottom-left","bottom-right","top-left","top-right"]}}' aria-hidden="true">
        <div class="menu menu_size_m menu_theme_islands menu_mode_radio-check menu__control select__menu i-bem" data-bem='{"menu":{}}'>
            <div class="menu-item menu-item_theme_islands i-bem" data-bem='{"menu-item":{"val":1}}' role="option" id="uniq14492417126293" aria-checked="false">Доклад</div>
            <div class="menu-item menu-item_checked menu-item_theme_islands i-bem" data-bem='{"menu-item":{"val":2}}' role="option" id="uniq14492417126294" aria-checked="true">Мастер-класс</div>
            <div class="menu-item menu-item_theme_islands i-bem" data-bem='{"menu-item":{"val":3}}' role="option" id="uniq14492417126295" aria-checked="false">Круглый стол</div>
        </div>
    </div>
</div>

BH results with different ids in aria-owns attribute but still unique across markup which seems to be strange.

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions