From 94b2eb49085b5f9021e420cbba7c6aea95fcad6f Mon Sep 17 00:00:00 2001
From: Poff Poffenberger <poffdeluxe@gmail.com>
Date: Mon, 9 Dec 2019 12:39:06 -0600
Subject: [PATCH] [Canvas] Add simple visual test for fullscreen  (#51234)

* Add simple visual test for fullscreen workpads in Canvas

* Adding canvas to the config

* Adding sample data visual tests

* Refactor to use new helper method

* Reverting sample data visual test for now

* Forgot to add the awaits
---
 .../functional/page_objects/canvas_page.ts    | 14 +++++++++
 x-pack/test/visual_regression/config.js       |  1 +
 .../tests/canvas/fullscreen.js                | 24 +++++++++++++++
 .../visual_regression/tests/canvas/index.js   | 29 +++++++++++++++++++
 4 files changed, 68 insertions(+)
 create mode 100644 x-pack/test/visual_regression/tests/canvas/fullscreen.js
 create mode 100644 x-pack/test/visual_regression/tests/canvas/index.js

diff --git a/x-pack/test/functional/page_objects/canvas_page.ts b/x-pack/test/functional/page_objects/canvas_page.ts
index 78863f91451f6a..a4b4f500b8832c 100644
--- a/x-pack/test/functional/page_objects/canvas_page.ts
+++ b/x-pack/test/functional/page_objects/canvas_page.ts
@@ -11,8 +11,22 @@ import { FtrProviderContext } from '../ftr_provider_context';
 export function CanvasPageProvider({ getService }: FtrProviderContext) {
   const testSubjects = getService('testSubjects');
   const find = getService('find');
+  const browser = getService('browser');
 
   return {
+    async enterFullscreen() {
+      const elem = await find.byCssSelector('[aria-label="View fullscreen"]', 20000);
+      await elem.click();
+    },
+
+    async exitFullscreen() {
+      await browser.pressKeys(browser.keys.ESCAPE);
+    },
+
+    async waitForWorkpadElements() {
+      await testSubjects.findAll('canvasWorkpadPage > canvasWorkpadPageElementContent');
+    },
+
     async expectCreateWorkpadButtonEnabled() {
       const button = await testSubjects.find('create-workpad-button', 20000);
       const disabledAttr = await button.getAttribute('disabled');
diff --git a/x-pack/test/visual_regression/config.js b/x-pack/test/visual_regression/config.js
index 4f77098d6a4565..ad9a714ee8d02f 100644
--- a/x-pack/test/visual_regression/config.js
+++ b/x-pack/test/visual_regression/config.js
@@ -13,6 +13,7 @@ export default async function ({ readConfigFile }) {
     ...functionalConfig.getAll(),
 
     testFiles: [
+      require.resolve('./tests/canvas'),
       require.resolve('./tests/login_page'),
       require.resolve('./tests/maps'),
       require.resolve('./tests/infra'),
diff --git a/x-pack/test/visual_regression/tests/canvas/fullscreen.js b/x-pack/test/visual_regression/tests/canvas/fullscreen.js
new file mode 100644
index 00000000000000..998fbb2c21f400
--- /dev/null
+++ b/x-pack/test/visual_regression/tests/canvas/fullscreen.js
@@ -0,0 +1,24 @@
+/*
+* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+* or more contributor license agreements. Licensed under the Elastic License;
+* you may not use this file except in compliance with the Elastic License.
+*/
+
+export default function ({ getPageObjects, getService }) {
+  const PageObjects = getPageObjects(['common', 'canvas']);
+  const visualTesting = getService('visualTesting');
+
+  describe('fullscreen', () => {
+    it('workpad should display properly in fullscreen mode', async () => {
+      await PageObjects.common.navigateToApp('canvas', {
+        hash: '/workpad/workpad-1705f884-6224-47de-ba49-ca224fe6ec31/page/1'
+      });
+
+      await PageObjects.canvas.enterFullscreen();
+
+      await PageObjects.canvas.waitForWorkpadElements();
+
+      await visualTesting.snapshot();
+    });
+  });
+}
diff --git a/x-pack/test/visual_regression/tests/canvas/index.js b/x-pack/test/visual_regression/tests/canvas/index.js
new file mode 100644
index 00000000000000..29bfd07c525cd5
--- /dev/null
+++ b/x-pack/test/visual_regression/tests/canvas/index.js
@@ -0,0 +1,29 @@
+/*
+* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+* or more contributor license agreements. Licensed under the Elastic License;
+* you may not use this file except in compliance with the Elastic License.
+*/
+import { DEFAULT_OPTIONS } from '../../../../../test/visual_regression/services/visual_testing/visual_testing';
+
+const [SCREEN_WIDTH] = DEFAULT_OPTIONS.widths || [];
+
+export default function ({ loadTestFile, getService }) {
+  const esArchiver = getService('esArchiver');
+  const browser = getService('browser');
+
+  describe('canvas app visual regression', function () {
+    before(async () => {
+      await esArchiver.loadIfNeeded('logstash_functional');
+      await esArchiver.load('canvas/default');
+
+      await browser.setWindowSize(SCREEN_WIDTH, 1000);
+    });
+
+    after(async () => {
+      await esArchiver.unload('canvas/default');
+    });
+
+    this.tags('ciGroup10');
+    loadTestFile(require.resolve('./fullscreen'));
+  });
+}