ci: enable chromatic again (#61197)

Author: burmudar

dev/ci/internal/ci/client_operations.go

@@ -65,33 +65,33 @@ func recordBrowserExtensionIntegrationTests(pipeline *bk.Pipeline) {
 
 func clientChromaticTests(opts CoreTestOperationsOptions) operations.Operation {
 	return func(pipeline *bk.Pipeline) {
-		// stepOpts := []bk.StepOpt{
-		// 	withPnpmCache(),
-		// 	bk.AutomaticRetry(3),
-		// 	bk.Cmd("./dev/ci/pnpm-install-with-retry.sh"),
-		// 	bk.Cmd("pnpm run generate"),
-		// 	bk.Env("MINIFY", "1"),
-		// }
-		//
-		// // Upload storybook to Chromatic
-		// //
-		// // We run chromatic through `run-chromatic` because the script detects whether a build is being retried
-		// // and then adds the flag `--force-rebuild`. We need to do this because Chromatic fails when running on
-		// // the same commit.
-		// chromaticCommand := "./dev/ci/run-chromatic.sh --exit-zero-on-changes --exit-once-uploaded"
-		// if opts.ChromaticShouldAutoAccept {
-		// 	// have to specify a value. Value can either be a branch glob or a boolean
-		// 	// see https://www.chromatic.com/docs/cli/
-		// 	chromaticCommand += " --auto-accept-changes true"
-		// } else {
-		// 	// Unless we plan on automatically accepting these changes, we only run this
-		// 	// step on ready-for-review pull requests.
-		// 	stepOpts = append(stepOpts, bk.IfReadyForReview(opts.ForceReadyForReview))
-		// 	chromaticCommand += " | ./dev/ci/post-chromatic.sh"
-		// }
+		stepOpts := []bk.StepOpt{
+			withPnpmCache(),
+			bk.AutomaticRetry(3),
+			bk.Cmd("./dev/ci/pnpm-install-with-retry.sh"),
+			bk.Cmd("pnpm run generate"),
+			bk.Env("MINIFY", "1"),
+		}
+
+		// Upload storybook to Chromatic
 		//
-		// pipeline.AddStep(":chromatic: Upload Storybook to Chromatic",
-		// 	append(stepOpts, bk.Cmd(chromaticCommand))...)
+		// We run chromatic through `run-chromatic` because the script detects whether a build is being retried
+		// and then adds the flag `--force-rebuild`. We need to do this because Chromatic fails when running on
+		// the same commit.
+		chromaticCommand := "./dev/ci/run-chromatic.sh --exit-zero-on-changes --exit-once-uploaded"
+		if opts.ChromaticShouldAutoAccept {
+			// have to specify a value. Value can either be a branch glob or a boolean
+			// see https://www.chromatic.com/docs/cli/
+			chromaticCommand += " --auto-accept-changes true"
+		} else {
+			// Unless we plan on automatically accepting these changes, we only run this
+			// step on ready-for-review pull requests.
+			stepOpts = append(stepOpts, bk.IfReadyForReview(opts.ForceReadyForReview))
+			chromaticCommand += " | ./dev/ci/post-chromatic.sh"
+		}
+
+		pipeline.AddStep(":chromatic: Upload Storybook to Chromatic",
+			append(stepOpts, bk.Cmd(chromaticCommand))...)
 	}
 }
 

package.json

@@ -180,7 +180,7 @@
     "bundlesize2": "^0.0.31",
     "chalk": "^4.1.0",
     "chokidar-cli": "^2.1.0",
-    "chromatic": "^10.1.0",
+    "chromatic": "^11.0.8",
     "chrome-webstore-upload-cli": "^1.2.0",
     "command-exists": "^1.2.9",
     "compression": "^1.7.4",
@@ -252,7 +252,7 @@
     "term-size": "^2.2.0",
     "text-table": "^0.2.0",
     "ts-dedent": "^2.2.0",
-    "ts-node": "^10.7.0",
+    "ts-node": "^10.9.2",
     "typed-scss-modules": "^4.1.1",
     "typescript": "^5.0.2",
     "utc-version": "^2.0.2",