diff --git a/docs/management/cases/add-connectors.asciidoc b/docs/management/cases/add-connectors.asciidoc
index dac588b99950d..c193a42b8fb29 100644
--- a/docs/management/cases/add-connectors.asciidoc
+++ b/docs/management/cases/add-connectors.asciidoc
@@ -26,8 +26,11 @@ as described in <<action-types>>. Alternatively, you can create them in
 
 . Click *Edit external connection*.
 +
+--
 [role="screenshot"]
 image::images/cases-connectors.png[]
+// NOTE: This is an autogenerated screenshot. Do not edit it directly.
+--
 
 . From the *Incident management system* list, select *Add new connector*.
 
diff --git a/docs/management/cases/cases.asciidoc b/docs/management/cases/cases.asciidoc
index de2f2196ee63f..dc72b453f5e94 100644
--- a/docs/management/cases/cases.asciidoc
+++ b/docs/management/cases/cases.asciidoc
@@ -10,6 +10,7 @@ management systems by configuring connectors.
 
 [role="screenshot"]
 image::images/cases.png[Cases page]
+// NOTE: This is an autogenerated screenshot. Do not edit it directly.
 
 NOTE: If you create cases in the {observability} or {security-app}, they are not
 visible in *{stack-manage-app}*. Likewise, the cases you create in
diff --git a/docs/management/cases/images/cases-connectors.png b/docs/management/cases/images/cases-connectors.png
index 95af429aef2de..deec94f09871a 100644
Binary files a/docs/management/cases/images/cases-connectors.png and b/docs/management/cases/images/cases-connectors.png differ
diff --git a/docs/management/cases/manage-cases.asciidoc b/docs/management/cases/manage-cases.asciidoc
index 71b1694e046a8..1a04a8a00e24b 100644
--- a/docs/management/cases/manage-cases.asciidoc
+++ b/docs/management/cases/manage-cases.asciidoc
@@ -32,6 +32,7 @@ example, you can portray event and alert data through charts and graphs.
 
 [role="screenshot"]
 image::images/cases-visualization.png[Cases page]
+// NOTE: This is an autogenerated screenshot. Do not edit it directly.
 
 To add a visualization to a comment within your case:
 
diff --git a/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/details_view.ts b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/details_view.ts
index 3257814eae2bf..da6e1f1216050 100644
--- a/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/details_view.ts
+++ b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/details_view.ts
@@ -14,7 +14,7 @@ export default function ({ getService }: FtrProviderContext) {
   const screenshotDirectories = ['response_ops_docs', 'stack_cases'];
   let CASE_ID: string;
 
-  describe('deatils view', function () {
+  describe('details view', function () {
     before(async () => {
       const { id: caseId } = await cases.api.createCase({
         title: 'Web transactions',
diff --git a/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/external_connections.ts b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/external_connections.ts
new file mode 100644
index 0000000000000..4af31cfba2feb
--- /dev/null
+++ b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/external_connections.ts
@@ -0,0 +1,23 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { FtrProviderContext } from '../../../ftr_provider_context';
+
+export default function ({ getService }: FtrProviderContext) {
+  const cases = getService('cases');
+  const commonScreenshots = getService('commonScreenshots');
+
+  const screenshotDirectories = ['response_ops_docs', 'stack_cases'];
+
+  describe('edit external connections', function () {
+    it('cases configure screenshot', async () => {
+      await cases.navigation.navigateToApp();
+      await cases.navigation.navigateToConfigurationPage();
+      await commonScreenshots.takeScreenshot('cases-connectors', screenshotDirectories, 1400, 1024);
+    });
+  });
+}
diff --git a/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/index.ts b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/index.ts
index 45138204e52f5..497805b1f0085 100644
--- a/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/index.ts
+++ b/x-pack/test/screenshot_creation/apps/response_ops_docs/stack_cases/index.ts
@@ -11,5 +11,6 @@ export default function ({ loadTestFile }: FtrProviderContext) {
   describe('stack cases', function () {
     loadTestFile(require.resolve('./list_view'));
     loadTestFile(require.resolve('./details_view'));
+    loadTestFile(require.resolve('./external_connections'));
   });
 }