Clarify focusUiFind function name, fix existing

tests, add TraceTimelineViewer/duck.tsx tests

Signed-off-by: Everett Ross <reverett@uber.com>

packages/jaeger-ui/src/components/TracePage/ScrollManager.tsx

@@ -12,10 +12,6 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import _get from 'lodash/get';
-import _findIndex from 'lodash/findIndex';
-import _isUndefined from 'lodash/isUndefined';
-
 import { TNil } from '../../types';
 import { Span, SpanReference, Trace } from '../../types/trace';
 
@@ -135,11 +131,8 @@ export default class ScrollManager {
     }
     const { duration, spans, startTime: traceStartTime } = this._trace;
     const isUp = direction < 0;
-    const boundaryRow = _isUndefined(startRow)
-      ? isUp ? xrs.getTopRowIndexVisible() : xrs.getBottomRowIndexVisible()
-      : startRow;
-    console.log(boundaryRow);
-    const spanIndex = xrs.mapRowIndexToSpanIndex(boundaryRow);
+    const boundaryRow = isUp ? xrs.getTopRowIndexVisible() : xrs.getBottomRowIndexVisible();
+    const spanIndex = xrs.mapRowIndexToSpanIndex(startRow != null ? startRow : boundaryRow);
     if ((spanIndex === 0 && isUp) || (spanIndex === spans.length - 1 && !isUp)) {
       return;
     }

packages/jaeger-ui/src/components/TracePage/TracePageHeader/TracePageHeader.tsx

@@ -40,7 +40,7 @@ import './TracePageHeader.css';
 type TracePageHeaderEmbedProps = {
   canCollapse: boolean;
   clearSearch: () => void;
-  focusUiFind: () => void;
+  focusUiFindMatches: () => void;
   hideMap: boolean;
   hideSummary: boolean;
   linkToStandalone: string;
@@ -96,7 +96,7 @@ export function TracePageHeaderFn(props: TracePageHeaderEmbedProps & { forwarded
   const {
     canCollapse,
     clearSearch,
-    focusUiFind,
+    focusUiFindMatches,
     forwardedRef,
     hideMap,
     hideSummary,
@@ -166,7 +166,7 @@ export function TracePageHeaderFn(props: TracePageHeaderEmbedProps & { forwarded
         {showShortcutsHelp && <KeyboardShortcutsHelp className="ub-mr2" />}
         <TracePageSearchBar
           clearSearch={clearSearch}
-          focusUiFind={focusUiFind}
+          focusUiFindMatches={focusUiFindMatches}
           nextResult={nextResult}
           prevResult={prevResult}
           ref={forwardedRef}

packages/jaeger-ui/src/components/TracePage/TracePageHeader/TracePageSearchBar.test.js

@@ -55,7 +55,7 @@ describe('<TracePageSearchBar>', () => {
 
     it('renders buttons', () => {
       const buttons = wrapper.find('Button');
-      expect(buttons.length).toBe(3);
+      expect(buttons.length).toBe(4);
       buttons.forEach(button => {
         expect(button.hasClass('TracePageSearchBar--btn')).toBe(true);
         expect(button.hasClass('is-disabled')).toBe(false);
@@ -66,15 +66,11 @@ describe('<TracePageSearchBar>', () => {
       expect(wrapper.find('Button[icon="close"]').prop('onClick')).toBe(defaultProps.clearSearch);
     });
 
-    it('disables navigation buttons when not navigable', () => {
+    it('hides navigation buttons when not navigable', () => {
       wrapper.setProps({ navigable: false });
-      const buttons = wrapper.find('Button');
-      expect(buttons.length).toBe(3);
-      buttons.forEach((button, i) => {
-        expect(button.hasClass('TracePageSearchBar--btn')).toBe(true);
-        expect(button.hasClass('is-disabled')).toBe(i !== 2);
-        expect(button.prop('disabled')).toBe(i !== 2);
-      });
+      const button = wrapper.find('Button');
+      expect(button.length).toBe(1);
+      expect(button.prop('icon')).toBe('close');
     });
   });
 
@@ -89,7 +85,7 @@ describe('<TracePageSearchBar>', () => {
 
     it('renders buttons', () => {
       const buttons = wrapper.find('Button');
-      expect(buttons.length).toBe(3);
+      expect(buttons.length).toBe(4);
       buttons.forEach(button => {
         expect(button.hasClass('TracePageSearchBar--btn')).toBe(true);
         expect(button.hasClass('is-disabled')).toBe(true);

packages/jaeger-ui/src/components/TracePage/TracePageHeader/TracePageSearchBar.tsx

@@ -28,15 +28,15 @@ type TracePageSearchBarProps = {
   prevResult: () => void;
   nextResult: () => void;
   clearSearch: () => void;
-  focusUiFind: () => void;
+  focusUiFindMatches: () => void;
   resultCount: number;
   navigable: boolean;
 };
 
 export function TracePageSearchBarFn(props: TracePageSearchBarProps & { forwardedRef: React.Ref<Input> }) {
   const {
     clearSearch,
-    focusUiFind,
+    focusUiFindMatches,
     forwardedRef,
     navigable,
     nextResult,
@@ -47,8 +47,7 @@ export function TracePageSearchBarFn(props: TracePageSearchBarProps & { forwarde
 
   const count = textFilter ? <span className="TracePageSearchBar--count">{resultCount}</span> : null;
 
-  const navigationBtnDisabled = !navigable || !textFilter;
-  const navigationBtnClass = cx('TracePageSearchBar--btn', { 'is-disabled': navigationBtnDisabled });
+  const navigationBtnClass = cx('TracePageSearchBar--btn', { 'is-disabled': !textFilter });
   const btnClass = cx('TracePageSearchBar--btn', { 'is-disabled': !textFilter });
   const uiFindInputInputProps = {
     'data-test': markers.IN_TRACE_SEARCH,
@@ -66,27 +65,31 @@ export function TracePageSearchBarFn(props: TracePageSearchBarProps & { forwarde
           forwardedRef={forwardedRef}
           trackFindFunction={trackFilter}
         />
-        <Button
-          className={navigationBtnClass}
-          disabled={navigationBtnDisabled}
-          htmlType="button"
-          icon="up"
-          onClick={prevResult}
-        />
-        <Button
-          className={navigationBtnClass}
-          disabled={navigationBtnDisabled}
-          htmlType="button"
-          icon="down"
-          onClick={nextResult}
-        />
-        <Button
-          className={navigationBtnClass}
-          disabled={navigationBtnDisabled}
-          htmlType="button"
-          icon="search"
-          onClick={focusUiFind}
-        />
+        {navigable && (
+          <>
+            <Button
+              className={navigationBtnClass}
+              disabled={!textFilter}
+              htmlType="button"
+              icon="up"
+              onClick={prevResult}
+            />
+            <Button
+              className={navigationBtnClass}
+              disabled={!textFilter}
+              htmlType="button"
+              icon="down"
+              onClick={nextResult}
+            />
+            <Button
+              className={navigationBtnClass}
+              disabled={!textFilter}
+              htmlType="button"
+              icon="search"
+              onClick={focusUiFindMatches}
+            />
+          </>
+        )}
         <Button
           className={btnClass}
           disabled={!textFilter}

packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.test.js

@@ -16,6 +16,7 @@
 jest.mock('../utils');
 
 import React from 'react';
+import { Button } from 'antd';
 import { shallow } from 'enzyme';
 
 import AccordianKeyValues from './AccordianKeyValues';
@@ -122,7 +123,7 @@ describe('<SpanDetail>', () => {
   });
 
   it('calls addToUiFind when the spanID is clicked', () => {
-    const spanIDButton = wrapper.find('button');
+    const spanIDButton = wrapper.find(Button);
     spanIDButton.simulate('click');
     expect(props.addToUiFind).toHaveBeenCalledWith(props.span.spanID);
   });