Add screenshots, fix typos.

Signed-off-by: Eric Promislow <[email protected]>

Author: ericpromislow

CONTRIBUTING.md

@@ -15,8 +15,8 @@ creating the pull request. This can reduce rework.
 ## Sign Your Commits
 
 A sign-off is a line at the end of the explanation for a commit.
-All commits must to be signed. Your signature certifies that you wrote the patch
-or otherwise have the right to contribute the material. When you sign-off you
+All commits must be signed. Your signature certifies that you wrote the patch
+or otherwise have the right to contribute the material. When you sign off you
 agree to the following rules
 (from [developercertificate.org](https://developercertificate.org/)):
 
@@ -104,23 +104,33 @@ clear and easy to fix (and can be avoided by running `npm t` locally before crea
 But when an integration, or e2e test, fails, it's sometimes useful to consult the log files
 for the run.
 
-These can be found by first going to the github page for the PR (for an example, find an open PR at https://github.com/rancher-sandbox/rancher-desktop/pulls?q=is%3Aopen+is%3Apr),
+Here's how to see more details for a failed run:
+
+1. The test results can be found by first going to the GitHub page for the PR (for an example, find an open PR at https://github.com/rancher-sandbox/rancher-desktop/pulls?q=is%3Aopen+is%3Apr),
 then look for the list of checks, find the `E2E/Integration Tests` entry, and click on the `Details` link for the first view.
 
+![Failing E2E tests link](./docs/assets/images/cilogs/screenshot01.png)
+
 This takes you to a more detailed view of the test, and which tests failed, but the log files are a few more clicks away.
 
-First, scroll to the bottom and click on the link that reads `View more details on Cirrus CI`.
+2. Scroll to the bottom and click on the link that reads `View more details on Cirrus CI`.
+
+![Link to Cirrus CI](./docs/assets/images/cilogs/screenshot02.png)
+3. Once the full test run has completed, the `Artifacts` button acts like a file-system browser.
+   The key here is to *not* click on the download button, but to click anywhere else on the row containing the button.
 
-On that page, click on the `Debug` icon near the top-right of the view.
+![artifacts expansion button](./docs/assets/images/cilogs/screenshot03.png)
+4. This opens up a file browser. Now click on the list-view icon (the left of the two icons at the right of the row).
 
-Scroll to the bottom of the text view, where there should be a section labelled `Artifacts`, with the text `playwright`.
 
-Clicking on the `playwright` bar should download a file called `playwright.zip` to your download directory.
-Unzipping it extracts a collection of nested `zip` and `tar` files corresponding to each of the `e2e` tests.
-You then need to crack open the tar file and you'll find the usual `*.log` files from that test's run.
+![list-view button](./docs/assets/images/cilogs/screenshot04.png)
+5. Find the `.tar` file for the failed test, and click on it to download it into your designated `downloads` directory.
 
-Because each test's tar file contains the same log files, it's a good idea to extract them into a separate
-directory. For example, if you're working with PR 5188
+
+![tar-file link](./docs/assets/images/cilogs/screenshot05.png)
+
+6. Because each test's tar file contains the same log files, it's a good idea to extract them into a separate
+directory. For example, if you're working with PR 5188:
 
 ```bash
 Downloads$ mkdir pr5188
@@ -140,6 +150,10 @@ k3s.log            lima.log             server.log         wsl.log
 At this point, ideally,
 the failure in the integration run will be tied to an exception in a log file related to the change in the PR.
 
+Also note that due to code transpilation,
+the file names and line numbers in the log files will not usually correspond to the lines in the source code.
+You might want to add some `console.log` statements around the problematic area to highlight a problematic area.
+
 ## Semantic Versioning
 
 Rancher Desktop follows [semantic versioning](https://semver.org/).