From 70e9177e2c3b4b53d36f567210121c5604cccd19 Mon Sep 17 00:00:00 2001
From: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
Date: Thu, 28 Sep 2023 12:47:09 -0400
Subject: [PATCH] chore: add script for updating local snapshots (#28254)

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

Team members often need to update the ground truth screenshots when
validating visual regressions or working on a design change. The command
may be unfamiliar to them or they may be new to the project/playwright.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Adds a new script to the `core` package for updating the local (to the
file system) ground truth screenshots.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
---
 core/package.json                                         | 1 +
 core/src/utils/test/playwright/docs/usage-instructions.md | 8 +++++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/core/package.json b/core/package.json
index 9c14a6f3d2..18813d3f01 100644
--- a/core/package.json
+++ b/core/package.json
@@ -95,6 +95,7 @@
     "test.spec": "stencil test --spec --max-workers=2",
     "test.spec.debug": "npx --node-arg=\"--inspect-brk\" stencil test --spec",
     "test.e2e": "npx playwright test",
+    "test.e2e.update-snapshots": "npm run test.e2e -- --update-snapshots",
     "test.watch": "jest --watch --no-cache",
     "test.treeshake": "node scripts/treeshaking.js dist/index.js",
     "validate": "npm run lint && npm run test && npm run build && npm run test.treeshake"
diff --git a/core/src/utils/test/playwright/docs/usage-instructions.md b/core/src/utils/test/playwright/docs/usage-instructions.md
index 8a2fa44bc6..de7c348018 100644
--- a/core/src/utils/test/playwright/docs/usage-instructions.md
+++ b/core/src/utils/test/playwright/docs/usage-instructions.md
@@ -59,7 +59,13 @@ The examples provided in the [Running Tests](#running-tests) section also apply
 Note that since you are generating the reference branch ground truth screenshots, you must be on the reference branch locally. Don't forget to pull the latest reference branch changes and then re-build using `npm run build`.
 
 ```shell
-npm run test.e2e -- --update-snapshots
+npm run test.e2e.update-snapshots
+```
+
+Optionally, you can pass a directory to only update the ground truths for that directory & subdirectories. This is useful when working on a specific component.
+
+```shell
+npm run test.e2e.update-snapshots src/components/alert/
 ```
 
 From here, you can switch back to your branch and run the tests.