fix 'Add' button in empty dashboard (#21816)

* fix 'Add' button in empty dashboard

* goto dashboard landing page after empty dashboard test

* add comment about event being undefined

src/core_plugins/kibana/public/dashboard/dashboard_app.html

@@ -51,7 +51,7 @@ <h2 class="kuiTitle kuiVerticalRhythm">
     </h2>
 
     <p class="kuiText kuiVerticalRhythm">
-      Click the <a kbn-accessible-click class="kuiButton kuiButton--primary kuiButton--small" ng-click="showAddPanel()" aria-label="Add visualization">Add</a> button in the menu bar above to add a visualization to the dashboard. <br/>If you haven't set up any visualizations yet, <a class="kuiLink" href="#/visualize">visit the Visualize app</a> to create your first visualization.
+      Click the <a kbn-accessible-click class="kuiButton kuiButton--primary kuiButton--small" ng-click="showAddPanel()" aria-label="Add visualization" data-test-subj="emptyDashboardAddPanelButton">Add</a> button in the menu bar above to add a visualization to the dashboard. <br/>If you haven't set up any visualizations yet, <a class="kuiLink" href="#/visualize">visit the Visualize app</a> to create your first visualization.
     </p>
   </div>
 
@@ -70,4 +70,4 @@ <h2 class="kuiTitle kuiVerticalRhythm">
   >
   </dashboard-viewport-provider>
 
-</dashboard-app>
+</dashboard-app>

src/ui/public/kbn_top_nav/kbn_top_nav_controller.js

@@ -17,7 +17,7 @@
  * under the License.
  */
 
-import { capitalize, isArray, isFunction } from 'lodash';
+import { capitalize, isArray, isFunction, get } from 'lodash';
 
 import chrome from '../chrome';
 import filterTemplate from '../chrome/config/filter.html';
@@ -83,7 +83,8 @@ export function KbnTopNavControllerProvider($compile) {
       if (menuItem.disableButton()) {
         return false;
       }
-      menuItem.run(menuItem, this, event.target);
+      // event will be undefined when method is called from click
+      menuItem.run(menuItem, this, get(event, 'target'));
     };
     // apply the defaults to individual options
     _applyOptDefault(opt = {}) {

test/functional/apps/dashboard/_empty_dashboard.js

@@ -0,0 +1,50 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import expect from 'expect.js';
+
+export default function ({ getService, getPageObjects }) {
+  const testSubjects = getService('testSubjects');
+  const dashboardAddPanel = getService('dashboardAddPanel');
+  const PageObjects = getPageObjects(['dashboard']);
+
+  describe('empty dashboard', async () => {
+    before(async () => {
+      await PageObjects.dashboard.clickNewDashboard();
+    });
+
+    after(async () => {
+      await dashboardAddPanel.closeAddPanel();
+      await PageObjects.dashboard.gotoDashboardLandingPage();
+    });
+
+    it('should display add button', async () => {
+      const addButtonExists = await testSubjects.exists('emptyDashboardAddPanelButton');
+      expect(addButtonExists).to.be(true);
+    });
+
+    it('should open add panel when add button is clicked', async () => {
+      await testSubjects.click('emptyDashboardAddPanelButton');
+      const isAddPanelOpen = await dashboardAddPanel.isAddPanelOpen();
+      expect(isAddPanelOpen).to.be(true);
+    });
+
+  });
+}
+

test/functional/apps/dashboard/index.js

@@ -42,6 +42,7 @@ export default function ({ getService, loadTestFile, getPageObjects }) {
 
       // This has to be first since the other tests create some embeddables as side affects and our counting assumes
       // a fresh index.
+      loadTestFile(require.resolve('./_empty_dashboard'));
       loadTestFile(require.resolve('./_embeddable_rendering'));
       loadTestFile(require.resolve('./_create_and_add_embeddables'));
       loadTestFile(require.resolve('./_time_zones'));