test: Test scenario hardware wallet qr based connect (#23623)

## **Description**

In this PR we add the scenario for the flow: eth sign with hardware
wallet.
This task belongs to the effort of documenting manual QA
flowshttps://github.com/#21962.

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/23623?quickstart=1)

## **Related issues**

Fixes:
[#22023](#22023)

## **Manual testing steps**

1. Check the video below

## **Screenshots/Recordings**


https://github.com/MetaMask/metamask-extension/assets/44811/1c182d29-8dd0-4ac1-80a9-f2879606c1ca

## **Pre-merge author checklist**

- [x] I’ve followed [MetaMask Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've clearly explained what problem this PR is solving and how it
is solved.
- [x] I've linked related issues
- [x] I've included manual testing steps
- [x] I've included screenshots/recordings if applicable
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.
- [x] I’ve properly set the pull request status:
  - [ ] In case it's not yet "ready for review", I've set it to "draft".
- [x] In case it's "ready for review", I've changed it from "draft" to
"non-draft".

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

test/scenarios/18. contract/hardware wallet qr based connect.csv

@@ -0,0 +1,12 @@
+Steps,Test Steps,Preconditions,Test Data,Expected Result,Notes
+1,Open the extension.,,,The Welcome Back screen is shown.,
+2,Proceed to unlock the wallet.,,password (8 characters min).,"The Ether balance is shown on the overview. The wallet address is shown on the overview.",
+3,"Click on account menu icon. Click ""Add account or hardware wallet"".",,,"The ""Add account"" modal is shown.",
+4,"On ""Add account"" modal, click ""Add hardware wallet"" button.",,,"""Connect a hardware wallet"" screen is shown. User can choose between different options to connect a hardware: Ledger, Trezor, Lattice, or QR-based. ""Continue"" button is disabled.",
+5,Choose an option to connect hardware wallet.,We need to have a hardware wallet set up to test this functionality.,"choose ""QR-based""","Hardware wallets that support QR scanning are shown, where to get them and how to connect. ""Continue"" button is also enabled.",
+6,"Setup your hardware wallet and open to the QR Scanning page",,,"The QR Code is shown on your hardware wallet",
+7,"Click ""Continue"" button on the extension",,,"A dialog is opened and the camera on the device is activated. You're now ready to scan the QR Code on your hardware wallet.",
+8,Scan the QR Code on your hardware wallet.,,,"""Select an account"" screen is shown on MetaMask, accounts on hardware wallet are shown on this screen.",
+9,"Choose one or multiples accounts that user wants to connect. Then click ""Unlock"".",,,,
+10,Click account menu icon to open accounts list.,,,"In accounts list, all selected QR hardware wallet accounts are shown, and they are all flagged with ""QR"" name to be distinguished from other accounts.",
+9,Select one hardware wallet account.,,,"The Ether balance for the selected hardware wallet account is shown on the overview. The selected account address is shown on the overview.",