feat(dashboard): direct link to single chart/tab/header in dashboard (#6964)

* direct display for pre-selected tab

* update parents

* add AnchorLink component

* add unit tests

superset/assets/spec/javascripts/dashboard/components/gridComponents/Header_spec.jsx

@@ -17,6 +17,7 @@
  * under the License.
  */
 import React from 'react';
+import { Provider } from 'react-redux';
 import { mount } from 'enzyme';
 import sinon from 'sinon';
 
@@ -33,6 +34,7 @@ import {
 } from '../../../../../src/dashboard/util/componentTypes';
 
 import WithDragDropContext from '../../helpers/WithDragDropContext';
+import { mockStoreWithTabs } from '../../fixtures/mockStore';
 
 describe('Header', () => {
   const props = {
@@ -43,6 +45,7 @@ describe('Header', () => {
     parentComponent: newComponentFactory(DASHBOARD_GRID_TYPE),
     index: 0,
     editMode: false,
+    filters: {},
     handleComponentDrop() {},
     deleteComponent() {},
     updateComponents() {},
@@ -52,9 +55,11 @@ describe('Header', () => {
     // We have to wrap provide DragDropContext for the underlying DragDroppable
     // otherwise we cannot assert on DragDroppable children
     const wrapper = mount(
-      <WithDragDropContext>
-        <Header {...props} {...overrideProps} />
-      </WithDragDropContext>,
+      <Provider store={mockStoreWithTabs}>
+        <WithDragDropContext>
+          <Header {...props} {...overrideProps} />
+        </WithDragDropContext>
+      </Provider>,
     );
     return wrapper;
   }

superset/assets/spec/javascripts/dashboard/components/gridComponents/Tabs_spec.jsx

@@ -18,7 +18,7 @@
  */
 import { Provider } from 'react-redux';
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import sinon from 'sinon';
 import { Tabs as BootstrapTabs, Tab as BootstrapTab } from 'react-bootstrap';
 
@@ -154,4 +154,20 @@ describe('Tabs', () => {
 
     expect(deleteComponent.callCount).toBe(1);
   });
+
+  it('should direct display direct-link tab', () => {
+    let wrapper = shallow(<Tabs {...props} />);
+    // default show first tab child
+    expect(wrapper.state('tabIndex')).toBe(0);
+
+    // display child in directPathToChild list
+    const directPathToChild = dashboardLayoutWithTabs.present.ROW_ID2.parents.slice();
+    const directLinkProps = {
+      ...props,
+      directPathToChild,
+    };
+
+    wrapper = shallow(<Tabs {...directLinkProps} />);
+    expect(wrapper.state('tabIndex')).toBe(1);
+  });
 });