fix: minor changes to improve stability for e2e tests (#1722)

#### Description of changes

One of the most common timeout issue in our e2e was in settings-panel & high-contrast e2e tests where the `keyPress('escape')` was not getting registered properly and so I changed that event with pressing the cross button on the settings panel to exit it. This should hopefully fix that timeout error on settings panel tests.

Also added `--no-cache` to `yarn:dev` in our docker to avoid a dev build cache system which I was hitting regularly in my local build.

<!--
  A great PR description includes:
    * A high level overview (usually a sentence or two) describing what the PR changes
    * What is the motivation for the change? This can be as simple as "addresses issue #123"
    * Were there any alternative approaches you considered? What tradeoffs did you consider?
    * What **doesn't** the change try to do? Are there any parts that you've intentionally left out-of-scope for a later PR to handle? What are the issues/work items tracking that later work?
    * Is there any other context that reviewers should consider? For example, other related issues/PRs, or any particularly tricky/subtle bits of implementation that need closer-than-normal review?
-->

#### Pull request checklist
<!-- If a checklist item is not applicable to this change, write "n/a" in the checkbox -->
- [ ] Addresses an existing issue: #0000
- [ ] Ran `yarn fastpass`
- [ ] Added/updated relevant unit test(s) (and ran `yarn test`)
- [ ] Verified code coverage for the changes made. Check coverage report at: `<rootDir>/test-results/unit/coverage`
- [ ] PR title *AND* final merge commit title both start with a semantic tag (`fix:`, `chore:`, `feat(feature-name):`, `refactor:`). Check workflow guide at: `<rootDir>/docs/workflow.md`
- [ ] (UI changes only) Added screenshots/GIFs to description above
- [ ] (UI changes only) Verified usability with NVDA/JAWS

Dockerfile

@@ -19,7 +19,7 @@ RUN yarn install --frozen-lockfile
 
 COPY . /app
 
-RUN yarn build:dev
+RUN yarn build:dev --no-cache
 
 # since we need our chromium to run in 'headful' mode (for testing chrome extension)
 # we need a fake display (to run headful chromium), which we create by starting a Virtualized X server environment using xvfb-run

src/tests/end-to-end/common/element-identifiers/details-view-selectors.ts

@@ -13,6 +13,7 @@ export const detailsViewSelectors = {
     gearButton: '.gear-options-icon',
     settingsButton: 'button[name="Settings"]',
     settingsPanel: '.settings-panel',
+    settingsPanelClose: 'button[title="Close settings panel"]',
     highContrastToggle: 'button#enable-high-contrast-mode',
     highContrastToggleCheckedStateSelector: 'button#enable-high-contrast-mode[aria-checked="true"]',
 };

src/tests/end-to-end/common/page-controllers/details-view-page.ts

@@ -39,12 +39,13 @@ export class DetailsViewPage extends Page {
     public async closeSettingsPanel(): Promise<void> {
         await this.waitForSelector(detailsViewSelectors.settingsPanel);
 
-        await this.keyPress('Escape');
+        await this.clickSelector(detailsViewSelectors.settingsPanelClose);
         await this.waitForSelectorToDisappear(detailsViewSelectors.settingsPanel);
     }
 
     public async enableHighContrast(): Promise<void> {
         await this.openSettingsPanel();
+        await this.waitForSelector(detailsViewSelectors.settingsPanelClose);
 
         await this.clickSelector(detailsViewSelectors.highContrastToggle);
         await this.waitForSelector(detailsViewSelectors.highContrastToggleCheckedStateSelector);