added a base test

Opentrons · Dec 14, 2024 · 996fde6 · 996fde6
1 parent 5daede5
commit 996fde6
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 16 deletions.
diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/DraggableSidebar.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/DraggableSidebar.tsx
@@ -74,11 +74,9 @@ export function DraggableSidebar({
   )
 }
 
-const SidebarContainer = styled(Box)<{ resizedWidth: number }>`
+const SidebarContainer = styled(Box) <{ resizedWidth: number }>`
   display: ${DISPLAY_FLEX};
   flex-direction: ${DIRECTION_COLUMN};
-  /* background-color: #f4f4f4; */
-  background-color: #ff0000;
   border-right: 1px solid #ccc;
   position: relative;
   width: ${props => props.resizedWidth}px;
@@ -90,7 +88,7 @@ const SidebarContent = styled(Flex)`
   flex: 1;
 `
 
-const SidebarResizer = styled(Flex)<{ dragging: boolean }>`
+const SidebarResizer = styled(Flex) <{ dragging: boolean }>`
   width: 0.3125rem;
   cursor: ew-resize;
   background-color: #ddd;

diff --git a/...col-designer/src/pages/Designer/ProtocolSteps/Timeline/__tests__/TimelineToolbox.test.tsx b/...col-designer/src/pages/Designer/ProtocolSteps/Timeline/__tests__/TimelineToolbox.test.tsx
@@ -41,6 +41,7 @@ describe('TimelineToolbox', () => {
     vi.mocked(PresavedStep).mockReturnValue(<div>mock PresavedStep</div>)
     vi.mocked(AddStepButton).mockReturnValue(<div>mock AddStepButton</div>)
   })
+
   it('renders 2 terminal item steps, a draggable step and presaved step with toolbox title', () => {
     render(props)
     screen.getByText('Timeline')

diff --git a/protocol-designer/src/pages/Designer/ProtocolSteps/__tests__/DraggableSidebar.test.tsx b/protocol-designer/src/pages/Designer/ProtocolSteps/__tests__/DraggableSidebar.test.tsx
@@ -3,21 +3,17 @@ import { screen } from '@testing-library/react'
 
 import { i18n } from '../../../../assets/localization'
 import { renderWithProviders } from '../../../../__testing-utils__'
-import { TimelineToolbox } from '../Timeline'
 import { DraggableSidebar } from '../DraggableSidebar'
 
 import type { ComponentProps } from 'react'
 
-vi.mock('../Timeline')
+
 vi.mock('../../../../step-forms/selectors')
 vi.mock('../../../../ui/steps/selectors')
-// vi.mock('../Timeline', async importOriginal => {
-//   const actual = await importOriginal<typeof TimelineToolbox>()
-//   return {
-//     ...actual,
-//     TimelineToolbox: () => <div>mock TimelineToolbox</div>,
-//   }
-// })
+vi.mock('../../../../feature-flags/selectors')
+vi.mock('../Timeline/DraggableSteps')
+vi.mock('../Timeline/PresavedStep')
+vi.mock('../Timeline/AddStepButton')
 
 const mockSetTargetWidth = vi.fn()
 
@@ -33,11 +29,14 @@ describe('DraggableSidebar', () => {
     props = {
       setTargetWidth: mockSetTargetWidth,
     }
-    vi.mocked(TimelineToolbox).mockReturnValue(<div>mock TimelineToolbox</div>)
   })
 
-  it('renders mock TimelineToolbox', () => {
+  it('renders initial timeline toolbox', () => {
     render(props)
-    screen.getByText('mock TimelineToolbox')
+    screen.getByText('Timeline')
+    screen.getByText('Starting deck')
+    screen.getByText('Ending deck')
   })
+
+  // ToDo (kk: 2024/12/12): Add more tests
 })