If I have an input with its aria-label set to 1 and an associated label set to 2, what will be calculated as aria label of an element, referencing the input?
<input type="radio" id="cpp-search-video-btn" aria-label="1" role="tab">
<label for="cpp-search-video-btn" aria-hidden="true">2</label>
<div id="cpp-search-video-tab" aria-labelledby="cpp-search-video-btn" role="tabpanel">…</div>
What's the aria label of the div#cpp-search-video-tab: 1, 2, or, maybe, unset? (I want it to be "1").
As far as I see, there is no information on substitutions at MDN.
The answer is indeed 1. ATtribute aria-labelledby has priority over aria-label, which itself has priority over <label>. See MDN
If an element has both attributes set, aria-labelledby will be used. aria-labelledby takes precedence over all other methods of providing an accessible name, including aria-label,
<label>, and the element's inner text.
However, if I can add another comment on your code:
<input type="radio" id="cpp-search-video-btn" aria-label="1" role="tab">
<label for="cpp-search-video-btn" aria-hidden="true">2</label>
It would be better to avoid using aria-hidden and ARIA at all if possible. The following code would be qualitatively better as pair the first rule of ARIA: don't use it, unless you really need.
<input type="radio" id="cpp-search-video-btn" role="tab">
<label for="cpp-search-video-btn">1</label>
Or maybe at least:
<input type="radio" id="cpp-search-video-btn" role="tab">
<label for="cpp-search-video-btn"><span class="sr_only">1</span><span aria-hidden="true">2</span></label>
More generally, if you have a real <label>, there shouldn't be any need to override it with aria-label. Otherwise it doesn't make much sense to have the <label> at the first place.