diff --git a/src/core_plugins/kibana/public/dashboard/dashboard.html b/src/core_plugins/kibana/public/dashboard/dashboard.html
index adf2797a6af38..4fdcd23a8710c 100644
--- a/src/core_plugins/kibana/public/dashboard/dashboard.html
+++ b/src/core_plugins/kibana/public/dashboard/dashboard.html
@@ -7,8 +7,8 @@
class="exitFullScreenMode"
ng-click="exitFullScreenMode()"
>
-
-
+
+
Exit full screen
diff --git a/src/core_plugins/kibana/public/dashboard/styles/index.less b/src/core_plugins/kibana/public/dashboard/styles/index.less
index ff46b18b6ca69..c2b9a024d82f5 100644
--- a/src/core_plugins/kibana/public/dashboard/styles/index.less
+++ b/src/core_plugins/kibana/public/dashboard/styles/index.less
@@ -19,6 +19,7 @@
padding: 0;
border: none;
background: none;
+ z-index: 5;
}
diff --git a/src/ui/public/styles/base.less b/src/ui/public/styles/base.less
index 9c0598e5b60a7..fb49d3de3d262 100644
--- a/src/ui/public/styles/base.less
+++ b/src/ui/public/styles/base.less
@@ -133,7 +133,6 @@ a {
.app-container {
> * {
position: relative;
- z-index: 0;
}
.kibana-nav-options {
diff --git a/test/functional/apps/dashboard/_dashboard.js b/test/functional/apps/dashboard/_dashboard.js
index 3ae4ea1476175..0c1df9a6b0ab3 100644
--- a/test/functional/apps/dashboard/_dashboard.js
+++ b/test/functional/apps/dashboard/_dashboard.js
@@ -220,8 +220,57 @@ export default function ({ getService, getPageObjects }) {
});
});
+ describe('full screen mode', () => {
+ it('option not available in edit mode', async () => {
+ const exists = await PageObjects.dashboard.fullScreenModeMenuItemExists();
+ expect(exists).to.be(false);
+ });
+
+ it('available in view mode', async () => {
+ await PageObjects.dashboard.saveDashboard('full screen test');
+ const exists = await PageObjects.dashboard.fullScreenModeMenuItemExists();
+ expect(exists).to.be(true);
+ });
+
+ it('hides the chrome', async () => {
+ let isChromeVisible = await PageObjects.common.isChromeVisible();
+ expect(isChromeVisible).to.be(true);
+
+ await PageObjects.dashboard.clickFullScreenMode();
+
+ await retry.try(async () => {
+ isChromeVisible = await PageObjects.common.isChromeVisible();
+ expect(isChromeVisible).to.be(false);
+ });
+ });
+
+ it('displays exit full screen logo button', async () => {
+ const exists = await PageObjects.dashboard.exitFullScreenLogoButtonExists();
+ expect(exists).to.be(true);
+ });
+
+ it('displays exit full screen logo button when panel is expanded', async () => {
+ await PageObjects.dashboard.toggleExpandPanel();
+
+ const exists = await PageObjects.dashboard.exitFullScreenTextButtonExists();
+ expect(exists).to.be(true);
+ });
+
+ it('exits when the text button is clicked on', async () => {
+ const logoButton = await PageObjects.dashboard.getExitFullScreenLogoButton();
+ await remote.moveMouseTo(logoButton);
+ await PageObjects.dashboard.clickExitFullScreenTextButton();
+
+ await retry.try(async () => {
+ const isChromeVisible = await PageObjects.common.isChromeVisible();
+ expect(isChromeVisible).to.be(true);
+ });
+ });
+ });
+
describe('add new visualization link', () => {
it('adds a new visualization', async () => {
+ await PageObjects.dashboard.clickEdit();
await PageObjects.dashboard.clickAddVisualization();
await PageObjects.dashboard.clickAddNewVisualizationLink();
await PageObjects.visualize.clickAreaChart();
diff --git a/test/functional/page_objects/dashboard_page.js b/test/functional/page_objects/dashboard_page.js
index dc0b537a2a03a..603f0f73b3be0 100644
--- a/test/functional/page_objects/dashboard_page.js
+++ b/test/functional/page_objects/dashboard_page.js
@@ -33,6 +33,39 @@ export function DashboardPageProvider({ getService, getPageObjects }) {
return logstash;
}
+ async clickFullScreenMode() {
+ log.debug(`clickFullScreenMode`);
+ await testSubjects.click('dashboardFullScreenMode');
+ }
+
+ async fullScreenModeMenuItemExists() {
+ return await testSubjects.exists('dashboardFullScreenMode');
+ }
+
+ async exitFullScreenTextButtonExists() {
+ return await testSubjects.exists('exitFullScreenModeText');
+ }
+
+ async getExitFullScreenTextButton() {
+ return await testSubjects.find('exitFullScreenModeText');
+ }
+
+ async exitFullScreenLogoButtonExists() {
+ return await testSubjects.exists('exitFullScreenModeLogo');
+ }
+
+ async getExitFullScreenLogoButton() {
+ return await testSubjects.find('exitFullScreenModeLogo');
+ }
+
+ async clickExitFullScreenLogoButton() {
+ await testSubjects.click('exitFullScreenModeLogo');
+ }
+
+ async clickExitFullScreenTextButton() {
+ await testSubjects.click('exitFullScreenModeText');
+ }
+
/**
* Returns true if already on the dashboard landing page (that page doesn't have a link to itself).
* @returns {Promise}