From 3a7669f8582f131a13576ac88dc3bdf15fc93cae Mon Sep 17 00:00:00 2001 From: Conrad Chan Date: Thu, 13 Jun 2019 12:54:08 -0700 Subject: [PATCH] chore: decouple resin tags from data testids --- .../SidebarToggleButton.js | 3 ++- .../SidebarToggleButton-test.js.snap | 12 ++++++------ src/elements/content-sidebar/SidebarNav.js | 14 +++++++++----- .../content-sidebar/SidebarNavButton.js | 17 +++++++++++++---- 4 files changed, 30 insertions(+), 16 deletions(-) diff --git a/src/components/sidebar-toggle-button/SidebarToggleButton.js b/src/components/sidebar-toggle-button/SidebarToggleButton.js index 27cecaa53e..426412d4b7 100644 --- a/src/components/sidebar-toggle-button/SidebarToggleButton.js +++ b/src/components/sidebar-toggle-button/SidebarToggleButton.js @@ -36,6 +36,7 @@ const SidebarToggleButton = ({ const classes = classNames(className, 'bdl-SidebarToggleButton', { 'bdl-is-collapsed': isCollapsed, }); + const tooltipPosition = direction === DIRECTION_LEFT ? 'middle-right' : 'middle-left'; const renderButton = () => { if (direction === DIRECTION_LEFT) { @@ -45,7 +46,7 @@ const SidebarToggleButton = ({ }; return ( - + {renderButton()} diff --git a/src/components/sidebar-toggle-button/__tests__/__snapshots__/SidebarToggleButton-test.js.snap b/src/components/sidebar-toggle-button/__tests__/__snapshots__/SidebarToggleButton-test.js.snap index 85d3e1e41d..e779a1a9a0 100644 --- a/src/components/sidebar-toggle-button/__tests__/__snapshots__/SidebarToggleButton-test.js.snap +++ b/src/components/sidebar-toggle-button/__tests__/__snapshots__/SidebarToggleButton-test.js.snap @@ -114,12 +114,12 @@ exports[`components/sidebar-toggle-button/SidebarToggleButton should render corr constrainToScrollParent={false} constrainToWindow={true} isDisabled={false} - position="middle-left" + position="middle-right" text="Show Sidebar" theme="default" > } classPrefix="tooltip" constraints={ @@ -133,7 +133,7 @@ exports[`components/sidebar-toggle-button/SidebarToggleButton should render corr enabled={false} renderElementTag="div" renderElementTo={null} - targetAttachment="middle left" + targetAttachment="middle right" > } classPrefix="tooltip" constraints={ @@ -230,7 +230,7 @@ exports[`components/sidebar-toggle-button/SidebarToggleButton should render corr enabled={false} renderElementTag="div" renderElementTo={null} - targetAttachment="middle left" + targetAttachment="middle right" > {hasActivity && ( { if (onNavigate) { diff --git a/src/elements/content-sidebar/SidebarNavButton.js b/src/elements/content-sidebar/SidebarNavButton.js index 4449e2bc17..9eb26ef8a9 100644 --- a/src/elements/content-sidebar/SidebarNavButton.js +++ b/src/elements/content-sidebar/SidebarNavButton.js @@ -11,15 +11,24 @@ import Tooltip from '../../components/tooltip/Tooltip'; import './SidebarNavButton.scss'; type Props = { + 'data-resin-target'?: string, + 'data-testid'?: string, children: React.Node, - interactionTarget: string, isOpen?: boolean, onNavigate?: (SyntheticEvent<>, NavigateOptions) => void, sidebarView: string, tooltip: React.Node, }; -const SidebarNavButton = ({ children, interactionTarget, isOpen, onNavigate, sidebarView, tooltip }: Props) => { +const SidebarNavButton = ({ + children, + 'data-resin-target': dataResinTarget, + 'data-testid': dataTestId, + isOpen, + onNavigate, + sidebarView, + tooltip, +}: Props) => { const sidebarPath = `/${sidebarView}`; return ( @@ -35,8 +44,8 @@ const SidebarNavButton = ({ children, interactionTarget, isOpen, onNavigate, sid aria-selected={isActive()} activeClassName="bcs-is-selected" className="bcs-NavButton" - data-resin-target={interactionTarget} - data-testid={interactionTarget} + data-resin-target={dataResinTarget} + data-testid={dataTestId} isActive={isActive} onClick={event => { if (onNavigate) {