Fix accessible name calculation bug related to nested `<label>`s

[rcj-siteimprove]

A variable was incorrectly being shadowed causing the state to be set incorrectly in some cases. This caused some kind of explosion in the recursion which, if there were enough <label>s inside the outer label (more than 5 I think), would lead to the maximum number of stack frames being exceeded.

In addition, if the number of inner labels was small enough, it would not crash, but the accessible name of the first <input> would be incorrect. This PR fixes that. The names of <input>s inside the inner <label>s are still computed differently than what Chrome computes. It's not completely clear yet, if Chrome is actually implementing the spec and if not, if we should follow chrome or the spec.

Example

<label>
  <input type="checkbox" name="Foo" value="Yes" />Foo
  <br />
  <label><input type="checkbox" name="Bar" value="Yes" />Bar</label>
</label>

In this example the first <input> was getting the computed name of "Foo Foo BarBar" where Chrome would get "Foo Bar". With this PR we are aligned with Chrome for that element.

I also updated some function descriptions with some examples to make it a little clearer what exactly referrer and referred means for <label> and <input>s.

To do

• [ ] Update failing test.
• [ ] Add test corresponding to above example.
• [ ] Investigate what the name of inner most <input> should be.