Enketo labels are not interactable

[dianabarsan]

Describe the bug
Due to labels now having display: contents, they are no longer interactable. This means they are visually rendered correctly, but they cannot receive clicks or other actions from the user.
Latest version of WebdriverIO requires elements to be interactable in order to get or receive values from. This behavior can be also viewed in Chrome dev tools when hovering over elements.

To Reproduce

Expected behavior
The user should be able to interact with elements that are visible on the page.

Logs
Sample of wdio logs when trying to get text from labels: https://github.com/medic/cht-core/actions/runs/6649138918/job/18067409025#step:16:626

Video

uninteractable.mp4

Environment

• Browser: Chrome
• App: Webapp
• Version: 4.5

Additional context
Introduced by a2d0cca

[latin-panda]

Pasting logs here since they have a limited life time at GHA

2023-10-26T03:58:30.703Z ERROR webdriver: Request failed with status 400 due to element not interactable: element not interactable
[0-3]   (Session info: headless chrome=118.0.5993.70)
[0-3] element not interactable in "Create user when adding contact.creates a new user while online"
element not interactable: element not interactable
  (Session info: headless chrome=118.0.5993.70)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Object.addPerson (/home/runner/work/cht-core/cht-core/tests/page-objects/default/contacts/contacts.wdio.page.js:191:3)
    at async Context.<anonymous> (/home/runner/work/cht-core/cht-core/tests/e2e/default/transitions/create-user-for-contacts.create-user.wdio-spec.js:159:5)
[0-3] 2023-10-26T03:58:38.602Z ERROR webdriver: Request failed with status 500 due to move target out of bounds: move target out of bounds
[0-3]   (Session info: headless chrome=118.0.5993.70)

[latin-panda]

• Have the developer tools' selector mode "on"
• Hover the input, and see how it shows a blue highlight and a tooltip with some info about the HTML node.
• Then hover just on top of the label, and observe how the blue highlight and the tooltip disappear.
  https://github.com/medic/cht-core/assets/66472237/1bd77f22-0979-4e6a-a00e-c30ccc831d95