Implement autocomplete for search

[joelit]

Link to relevant issue(s), if any

Autocomplete functionality for #1514

Description of the changes in this PR

This PR introduces a Bootstrap 5 dropdown menu for autocomplete, and it aims to fulfill the basic functionality of the search bar's autocomplete part.

• [x] 1.1 Dropdown menu should be styled with Bootsrap
• [x] 1.4 Input element should be rectangular
• [x] 1.5 Once user has stopped typing aftes X ms, submit the search
  • [x] 1.5.1 Process the search results into autoCompeteResults
• [x] 1.6 Append an asterix after the search term
• [x] 1.7 When the result list is calculated, display the dropdown
  • [x] 1.7.1 If there are no results, display a dropdown with no results -message
  • [x] 1.7.2 If the user writes more text in addition to previously given input, show the result of the latest input
• [x] 1.8 Hide the dropdown list, if the user
  • [x] 1.8.1 Clears the text box from the clear-button
  • [x] 1.8.2 Deletes the contentents of the input field
  • [x] 1.8.3 Clicks on somewhere outside of the search result dropdown
• [x] 3.7 Autocomplete should fire if there is at least two characters in the input string

Known problems or uncertainties in this PR

• Bootstrap 5 dropdown menu is designed to fire on click. If and when this is not desired, the showing and hiding has to be triggered in JS, which is rather odd

Checklist

• [x] phpUnit tests pass locally with my changes
• [x] I have added tests that show that the new code works, or tests are not relevant for this PR (e.g. only HTML/CSS changes)
• [x] The PR doesn't reduce accessibility of the front-end code (e.g. tab focus, scaling to different resolutions, use of .sr-only class, color contrast)
• [x] The PR doesn't introduce unintended code changes (e.g. empty lines or useless reindentation)

[codecov[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 70.58%. Comparing base (f22c504) to head (ddf2603). Report is 14 commits behind head on main.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #1589 +/- ## ========================================= Coverage 70.58% 70.58% Complexity 1647 1647 ========================================= Files 32 32 Lines 4321 4321 ========================================= Hits 3050 3050 Misses 1271 1271 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[sonarcloud[bot]]

Quality Gate passed

The SonarCloud Quality Gate passed, but some issues were introduced.

2 New issues
0 Security Hotspots
No data about Coverage
0.0% Duplication on New Code

See analysis details on SonarCloud

[joelit]

I changed the name of the PR and added missing tests. I found one bug with enter search related to encoding the search term, which I also fixed. I also fixed the comments and wrote further specs in the the main issue #1514 . Added parts were 3.5.1 about fethcing the type texts and 4.1 about the accessability and keyboard use of the search.

The PR should be ready for another round! I didn't squash the commits here, fearing I'd mess it up, but the merging to the main branch should be done with a squash.

[osma]

FYI, I changed the base branch of this PR briefly to skosmos-2 and then back to main. This made the diff view much cleaner (before: 14 changed files, after: only 4 changed files) as irrelevant changes that had already been merged to main were dropped from the diff view.

Currently reviewing.

[joelit]

Changed the way special characters are handled for the search itself, and how the matching part of the search results are displayed. Also changed URL parameters into URLSearchParams objects, and adjusted cypress tests to reflect these changes. :+1:

[sonarcloud[bot]]

Quality Gate passed

Issues
5 New issues
0 Accepted issues

Measures
0 Security Hotspots
No data about Coverage
0.0% Duplication on New Code

See analysis details on SonarCloud