diff --git a/src/DetailsView/components/assessment-test-view.tsx b/src/DetailsView/components/assessment-test-view.tsx
index ae0cb51944e..deb01996af2 100644
--- a/src/DetailsView/components/assessment-test-view.tsx
+++ b/src/DetailsView/components/assessment-test-view.tsx
@@ -73,7 +73,6 @@ export const AssessmentTestView = NamedFC<AssessmentTestViewProps>(
                     currentTarget={currentTarget}
                     prevTarget={prevTarget}
                     assessmentTestResult={assessmentTestResult}
-                    selectedRequirementIsEnabled={selectedRequirementIsEnabled}
                 />
             );
         };
diff --git a/src/DetailsView/components/assessment-view-update-handler.ts b/src/DetailsView/components/assessment-view-update-handler.ts
index 4cf0eeb7db6..83af945ff5b 100644
--- a/src/DetailsView/components/assessment-view-update-handler.ts
+++ b/src/DetailsView/components/assessment-view-update-handler.ts
@@ -26,7 +26,7 @@ export interface AssessmentViewUpdateHandlerProps {
     deps: AssessmentViewUpdateHandlerDeps;
     assessmentNavState: AssessmentNavState;
     assessmentData: AssessmentData;
-    selectedRequirementIsEnabled: boolean;
+    isRequirementEnabled: boolean;
     currentTarget: Tab;
     prevTarget: PersistedTabInfo;
 }
@@ -65,12 +65,12 @@ export class AssessmentViewUpdateHandler {
             return;
         }
 
-        const isStepNotScanned = !props.assessmentData.testStepStatus[step].isStepScanned;
-        if (props.selectedRequirementIsEnabled === false || isStepNotScanned) {
+        const isRequirementNotScanned = !props.assessmentData.testStepStatus[step].isStepScanned;
+        if (props.isRequirementEnabled === false || isRequirementNotScanned) {
             props.deps.detailsViewActionMessageCreator.enableVisualHelper(
                 test,
                 step,
-                isStepNotScanned,
+                isRequirementNotScanned,
                 sendTelemetry,
             );
         }
diff --git a/src/DetailsView/components/assessment-view.tsx b/src/DetailsView/components/assessment-view.tsx
index aaf9b9bc8eb..2eb75223b61 100644
--- a/src/DetailsView/components/assessment-view.tsx
+++ b/src/DetailsView/components/assessment-view.tsx
@@ -92,23 +92,13 @@ export class AssessmentView extends React.Component<AssessmentViewProps> {
         );
     }
 
-    public componentDidMount(): void {
-        this.deps.assessmentViewUpdateHandler.onMount(this.props);
-    }
-
     public componentDidUpdate(prevProps: AssessmentViewProps): void {
-        this.deps.assessmentViewUpdateHandler.update(prevProps, this.props);
-
         const { assessmentTestResult } = this.props;
         this.deps.detailsViewExtensionPoint
             .apply(assessmentTestResult.definition.extensions)
             .onAssessmentViewUpdate(prevProps, this.props);
     }
 
-    public componentWillUnmount(): void {
-        this.deps.assessmentViewUpdateHandler.onUnmount(this.props);
-    }
-
     private renderTargetChangeDialog(): JSX.Element {
         return (
             <TargetChangeDialog
@@ -184,6 +174,9 @@ export class AssessmentView extends React.Component<AssessmentViewProps> {
                         }
                         featureFlagStoreData={this.props.featureFlagStoreData}
                         pathSnippetStoreData={this.props.pathSnippetStoreData}
+                        assessmentData={this.props.assessmentData}
+                        currentTarget={this.props.currentTarget}
+                        prevTarget={this.props.prevTarget}
                     />
                 </div>
             </div>
diff --git a/src/DetailsView/components/reflow-assessment-view.tsx b/src/DetailsView/components/reflow-assessment-view.tsx
index 5d08ef3f14a..a9773f3342b 100644
--- a/src/DetailsView/components/reflow-assessment-view.tsx
+++ b/src/DetailsView/components/reflow-assessment-view.tsx
@@ -5,7 +5,6 @@ import * as React from 'react';
 import {
     AssessmentViewUpdateHandler,
     AssessmentViewUpdateHandlerDeps,
-    AssessmentViewUpdateHandlerProps,
 } from 'DetailsView/components/assessment-view-update-handler';
 import { AssessmentTestResult } from '../../common/assessment/assessment-test-result';
 import { Tab } from '../../common/itab';
@@ -29,7 +28,7 @@ export type ReflowAssessmentViewProps = {
     currentTarget: Tab;
     prevTarget: PersistedTabInfo;
     assessmentTestResult: AssessmentTestResult;
-} & AssessmentViewUpdateHandlerProps;
+};
 
 export class ReflowAssessmentView extends React.Component<ReflowAssessmentViewProps> {
     public render(): JSX.Element {
@@ -47,18 +46,6 @@ export class ReflowAssessmentView extends React.Component<ReflowAssessmentViewPr
         return null;
     }
 
-    public componentDidMount(): void {
-        this.props.deps.assessmentViewUpdateHandler.onMount(this.props);
-    }
-
-    public componentDidUpdate(prevProps: ReflowAssessmentViewProps): void {
-        this.props.deps.assessmentViewUpdateHandler.update(prevProps, this.props);
-    }
-
-    public componentWillUnmount(): void {
-        this.props.deps.assessmentViewUpdateHandler.onUnmount(this.props);
-    }
-
     private renderTargetChangeDialog(): JSX.Element {
         return (
             <TargetChangeDialog
diff --git a/src/DetailsView/components/test-step-view.tsx b/src/DetailsView/components/test-step-view.tsx
index f2b3aa7e95f..7120e4d8a43 100644
--- a/src/DetailsView/components/test-step-view.tsx
+++ b/src/DetailsView/components/test-step-view.tsx
@@ -6,9 +6,11 @@ import { Requirement, VisualHelperToggleConfig } from 'assessments/types/require
 import { CollapsibleComponent } from 'common/components/collapsible-component';
 import { GuidanceTags, GuidanceTagsDeps } from 'common/components/guidance-tags';
 import {
+    AssessmentData,
     AssessmentNavState,
     GeneratedAssessmentInstance,
     ManualTestStepResult,
+    PersistedTabInfo,
 } from 'common/types/store-data/assessment-result-data';
 import { FeatureFlagStoreData } from 'common/types/store-data/feature-flag-store-data';
 import { PathSnippetStoreData } from 'common/types/store-data/path-snippet-store-data';
@@ -17,6 +19,12 @@ import * as React from 'react';
 import { DictionaryStringTo } from 'types/common-types';
 import { ContentPanelButton, ContentPanelButtonDeps } from 'views/content/content-panel-button';
 
+import { Tab } from 'common/itab';
+import {
+    AssessmentViewUpdateHandler,
+    AssessmentViewUpdateHandlerDeps,
+    AssessmentViewUpdateHandlerProps,
+} from 'DetailsView/components/assessment-view-update-handler';
 import { DetailsViewActionMessageCreator } from '../actions/details-view-action-message-creator';
 import { AssessmentInstanceTableHandler } from '../handlers/assessment-instance-table-handler';
 import { AssessmentInstanceTable } from './assessment-instance-table';
@@ -25,10 +33,12 @@ import * as styles from './test-step-view.scss';
 
 export type TestStepViewDeps = {
     detailsViewActionMessageCreator: DetailsViewActionMessageCreator;
+    assessmentViewUpdateHandler: AssessmentViewUpdateHandler;
 } & ContentPanelButtonDeps &
-    GuidanceTagsDeps;
+    GuidanceTagsDeps &
+    AssessmentViewUpdateHandlerDeps;
 
-export interface TestStepViewProps {
+export type TestStepViewProps = {
     deps: TestStepViewDeps;
     isStepEnabled: boolean;
     isStepScanned: boolean;
@@ -43,7 +53,10 @@ export interface TestStepViewProps {
     assessmentDefaultMessageGenerator: AssessmentDefaultMessageGenerator;
     featureFlagStoreData: FeatureFlagStoreData;
     pathSnippetStoreData: PathSnippetStoreData;
-}
+    assessmentData: AssessmentData;
+    currentTarget: Tab;
+    prevTarget: PersistedTabInfo;
+};
 
 export class TestStepView extends React.Component<TestStepViewProps> {
     public render(): JSX.Element {
@@ -77,6 +90,34 @@ export class TestStepView extends React.Component<TestStepViewProps> {
         );
     }
 
+    public componentDidMount(): void {
+        this.props.deps.assessmentViewUpdateHandler.onMount(this.getUpdateHandlerProps(this.props));
+    }
+
+    public componentDidUpdate(prevProps: TestStepViewProps): void {
+        this.props.deps.assessmentViewUpdateHandler.update(
+            this.getUpdateHandlerProps(prevProps),
+            this.getUpdateHandlerProps(this.props),
+        );
+    }
+
+    public componentWillUnmount(): void {
+        this.props.deps.assessmentViewUpdateHandler.onUnmount(
+            this.getUpdateHandlerProps(this.props),
+        );
+    }
+
+    private getUpdateHandlerProps(props: TestStepViewProps): AssessmentViewUpdateHandlerProps {
+        return {
+            deps: props.deps,
+            isRequirementEnabled: props.isStepEnabled,
+            assessmentNavState: props.assessmentNavState,
+            assessmentData: props.assessmentData,
+            prevTarget: props.prevTarget,
+            currentTarget: props.currentTarget,
+        };
+    }
+
     private renderTable(): JSX.Element {
         if (this.props.testStep.isManual) {
             return (
diff --git a/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-test-view.test.tsx.snap b/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-test-view.test.tsx.snap
index 54f8691ab4f..97681ff846c 100644
--- a/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-test-view.test.tsx.snap
+++ b/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-test-view.test.tsx.snap
@@ -88,7 +88,6 @@ exports[`AssessmentTestView assessment view, isScanning is false 1`] = `
             "detailsViewActionMessageCreator": Object {},
           }
         }
-        selectedRequirementIsEnabled={false}
       />
     }
     featureFlag="reflowUI"
@@ -185,7 +184,6 @@ exports[`AssessmentTestView assessment view, isScanning is true 1`] = `
             "detailsViewActionMessageCreator": Object {},
           }
         }
-        selectedRequirementIsEnabled={false}
       />
     }
     featureFlag="reflowUI"
diff --git a/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-view.test.tsx.snap b/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-view.test.tsx.snap
index 50c6f293a2a..77b9fc5f24a 100644
--- a/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-view.test.tsx.snap
+++ b/src/tests/unit/tests/DetailsView/components/__snapshots__/assessment-view.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`AssessmentViewTest render 1`] = `
         <TestStepsNav deps={{...}} ariaLabel=\\"Requirements\\" selectedTest={-1} selectedTestStep=\\"assessment-1-step-1\\" stepStatus={{...}} />
       </div>
       <div className=\\"testStepViewContainer\\">
-        <TestStepView deps={{...}} isScanning={false} testStep={{...}} renderStaticContent={[undefined]} instancesMap={{...}} assessmentNavState={{...}} assessmentInstanceTableHandler={{...}} manualTestStepResultMap={{...}} assessmentsProvider={{...}} isStepEnabled={false} isStepScanned={false} assessmentDefaultMessageGenerator={{...}} featureFlagStoreData={{...}} pathSnippetStoreData={{...}} />
+        <TestStepView deps={{...}} isScanning={false} testStep={{...}} renderStaticContent={[undefined]} instancesMap={{...}} assessmentNavState={{...}} assessmentInstanceTableHandler={{...}} manualTestStepResultMap={{...}} assessmentsProvider={{...}} isStepEnabled={false} isStepScanned={false} assessmentDefaultMessageGenerator={{...}} featureFlagStoreData={{...}} pathSnippetStoreData={{...}} assessmentData={{...}} currentTarget={{...}} prevTarget={{...}} />
       </div>
     </div>
   </AssessmentViewMainContentExtensionPoint>
diff --git a/src/tests/unit/tests/DetailsView/components/__snapshots__/reflow-assessment-view.test.tsx.snap b/src/tests/unit/tests/DetailsView/components/__snapshots__/reflow-assessment-view.test.tsx.snap
index f47530cf044..f02d039d031 100644
--- a/src/tests/unit/tests/DetailsView/components/__snapshots__/reflow-assessment-view.test.tsx.snap
+++ b/src/tests/unit/tests/DetailsView/components/__snapshots__/reflow-assessment-view.test.tsx.snap
@@ -3,13 +3,7 @@
 exports[`AssessmentViewTest render for gettting started 1`] = `
 <div>
   <TargetChangeDialog
-    deps={
-      Object {
-        "assessmentViewUpdateHandler": proxy {
-          "___id": "BCDF5CE5-F0DF-40B7-8BA0-69DF395033C8",
-        },
-      }
-    }
+    deps={Object {}}
     newTab={
       Object {
         "id": 5,
diff --git a/src/tests/unit/tests/DetailsView/components/__snapshots__/test-step-view.test.tsx.snap b/src/tests/unit/tests/DetailsView/components/__snapshots__/test-step-view.test.tsx.snap
index ec5dcb2f8a4..66133951116 100644
--- a/src/tests/unit/tests/DetailsView/components/__snapshots__/test-step-view.test.tsx.snap
+++ b/src/tests/unit/tests/DetailsView/components/__snapshots__/test-step-view.test.tsx.snap
@@ -5,9 +5,9 @@ exports[`TestStepViewTest render snapshot matches with manual false and scanning
   <div className=\\"test-step-title-container\\">
     <h3 className=\\"test-step-view-title\\">
       Test Step Test Name
-      <GuidanceTags deps={[undefined]} links={{...}} />
+      <GuidanceTags deps={{...}} links={{...}} />
     </h3>
-    <ContentPanelButton deps={[undefined]} reference={[undefined]} iconName=\\"info\\" contentTitle=\\"Test Step Test Name\\">
+    <ContentPanelButton deps={{...}} reference={[undefined]} iconName=\\"info\\" contentTitle=\\"Test Step Test Name\\">
       Info &amp; examples
     </ContentPanelButton>
   </div>
@@ -25,9 +25,9 @@ exports[`TestStepViewTest render, variable part for assisted test 1`] = `
   <div className=\\"test-step-title-container\\">
     <h3 className=\\"test-step-view-title\\">
       Test Step Test Name
-      <GuidanceTags deps={[undefined]} links={{...}} />
+      <GuidanceTags deps={{...}} links={{...}} />
     </h3>
-    <ContentPanelButton deps={[undefined]} reference={[undefined]} iconName=\\"info\\" contentTitle=\\"Test Step Test Name\\">
+    <ContentPanelButton deps={{...}} reference={[undefined]} iconName=\\"info\\" contentTitle=\\"Test Step Test Name\\">
       Info &amp; examples
     </ContentPanelButton>
   </div>
diff --git a/src/tests/unit/tests/DetailsView/components/assessment-view-update-handler.test.ts b/src/tests/unit/tests/DetailsView/components/assessment-view-update-handler.test.ts
index abf77fe9bb8..4bd723439c8 100644
--- a/src/tests/unit/tests/DetailsView/components/assessment-view-update-handler.test.ts
+++ b/src/tests/unit/tests/DetailsView/components/assessment-view-update-handler.test.ts
@@ -18,12 +18,12 @@ describe('AssessmentViewTest', () => {
     const firstAssessment = assessmentsProvider.all()[0];
     const stepName = firstAssessment.requirements[0].key;
     let detailsViewActionMessageCreatorMock: IMock<DetailsViewActionMessageCreator>;
-    let selectedRequirementIsEnabled: boolean;
+    let isRequirementEnabled: boolean;
 
     let testObject: AssessmentViewUpdateHandler;
 
     beforeEach(() => {
-        selectedRequirementIsEnabled = false;
+        isRequirementEnabled = false;
         detailsViewActionMessageCreatorMock = Mock.ofType<DetailsViewActionMessageCreator>();
         testObject = new AssessmentViewUpdateHandler();
     });
@@ -71,7 +71,7 @@ describe('AssessmentViewTest', () => {
                     a.enableVisualHelper(firstAssessment.visualizationType, stepName, false),
                 )
                 .verifiable(Times.never());
-            selectedRequirementIsEnabled = true;
+            isRequirementEnabled = true;
             const props = buildProps({ selector: {} });
 
             testObject.onMount(props);
@@ -218,7 +218,7 @@ describe('AssessmentViewTest', () => {
             deps,
             prevTarget,
             currentTarget: isTargetChanged ? anotherTarget : prevTarget,
-            selectedRequirementIsEnabled: selectedRequirementIsEnabled,
+            isRequirementEnabled: isRequirementEnabled,
             assessmentNavState,
             assessmentData,
         };
diff --git a/src/tests/unit/tests/DetailsView/components/assessment-view.test.tsx b/src/tests/unit/tests/DetailsView/components/assessment-view.test.tsx
index eb216520c1c..f9599aee17f 100644
--- a/src/tests/unit/tests/DetailsView/components/assessment-view.test.tsx
+++ b/src/tests/unit/tests/DetailsView/components/assessment-view.test.tsx
@@ -37,16 +37,6 @@ describe('AssessmentViewTest', () => {
         expect(rendered.debug()).toMatchSnapshot();
     });
 
-    test('componentDidMount', () => {
-        const props = builder.buildProps();
-        builder.updateHandlerMock.setup(u => u.onMount(props)).verifiable(Times.once());
-
-        const testObject = new AssessmentView(props);
-
-        testObject.componentDidMount();
-        builder.verifyAll();
-    });
-
     test('componentDidUpdate', () => {
         const prevProps = buildPrevProps();
         const props = builder.buildProps();
@@ -54,7 +44,6 @@ describe('AssessmentViewTest', () => {
             (previousProps: AssessmentViewProps, currentProps: AssessmentViewProps) => {},
         );
 
-        builder.updateHandlerMock.setup(u => u.update(prevProps, props)).verifiable(Times.once());
         builder.detailsViewExtensionPointMock
             .setup(d => d.apply(props.assessmentTestResult.definition.extensions))
             .returns(() => {
@@ -71,16 +60,6 @@ describe('AssessmentViewTest', () => {
         onAssessmentViewUpdateMock.verifyAll();
     });
 
-    test('componentWillUnmount', () => {
-        const props = builder.buildProps();
-        builder.updateHandlerMock.setup(u => u.onUnmount(props)).verifiable(Times.once());
-
-        const testObject = new AssessmentView(props);
-
-        testObject.componentWillUnmount();
-        builder.verifyAll();
-    });
-
     function buildPrevProps(): AssessmentViewProps {
         const prevStep = 'prevStep';
         const prevTest = -100 as VisualizationType;
diff --git a/src/tests/unit/tests/DetailsView/components/reflow-assessment-view.test.tsx b/src/tests/unit/tests/DetailsView/components/reflow-assessment-view.test.tsx
index d54c8c89a5b..46f087b5911 100644
--- a/src/tests/unit/tests/DetailsView/components/reflow-assessment-view.test.tsx
+++ b/src/tests/unit/tests/DetailsView/components/reflow-assessment-view.test.tsx
@@ -4,9 +4,8 @@ import { AssessmentTestResult } from 'common/assessment/assessment-test-result';
 import { AssessmentData } from 'common/types/store-data/assessment-result-data';
 import { shallow } from 'enzyme';
 import * as React from 'react';
-import { IMock, Mock, Times } from 'typemoq';
+import { Mock } from 'typemoq';
 
-import { AssessmentViewUpdateHandler } from 'DetailsView/components/assessment-view-update-handler';
 import {
     ReflowAssessmentView,
     ReflowAssessmentViewDeps,
@@ -14,12 +13,6 @@ import {
 } from '../../../../../DetailsView/components/reflow-assessment-view';
 
 describe('AssessmentViewTest', () => {
-    let updateHandlerMock: IMock<AssessmentViewUpdateHandler>;
-
-    beforeEach(() => {
-        updateHandlerMock = Mock.ofType(AssessmentViewUpdateHandler);
-    });
-
     test('render for requirement', () => {
         const props = generateProps('requirement');
         const rendered = shallow(<ReflowAssessmentView {...props} />);
@@ -32,37 +25,6 @@ describe('AssessmentViewTest', () => {
         expect(rendered.getElement()).toMatchSnapshot();
     });
 
-    test('componentDidMount', () => {
-        const props = generateProps('requirement');
-        updateHandlerMock.setup(u => u.onMount(props)).verifiable(Times.once());
-        const testObject = new ReflowAssessmentView(props);
-
-        testObject.componentDidMount();
-
-        updateHandlerMock.verifyAll();
-    });
-
-    test('componentWillUnmount', () => {
-        const props = generateProps('requirement');
-        updateHandlerMock.setup(u => u.onUnmount(props)).verifiable(Times.once());
-        const testObject = new ReflowAssessmentView(props);
-
-        testObject.componentWillUnmount();
-
-        updateHandlerMock.verifyAll();
-    });
-
-    test('componentDidUpdate', () => {
-        const prevProps = generateProps('requirement1');
-        const props = generateProps('requirement2');
-        updateHandlerMock.setup(u => u.update(prevProps, props)).verifiable(Times.once());
-        const testObject = new ReflowAssessmentView(props);
-
-        testObject.componentDidUpdate(prevProps);
-
-        updateHandlerMock.verifyAll();
-    });
-
     function generateProps(subview: string): ReflowAssessmentViewProps {
         const assessmentDataMock = Mock.ofType<AssessmentData>();
 
@@ -73,9 +35,7 @@ describe('AssessmentViewTest', () => {
         } as AssessmentTestResult;
 
         const reflowProps = {
-            deps: {
-                assessmentViewUpdateHandler: updateHandlerMock.object,
-            } as ReflowAssessmentViewDeps,
+            deps: {} as ReflowAssessmentViewDeps,
             prevTarget: { id: 4 },
             currentTarget: { id: 5 },
             assessmentNavState: {
diff --git a/src/tests/unit/tests/DetailsView/components/test-step-view.test.tsx b/src/tests/unit/tests/DetailsView/components/test-step-view.test.tsx
index 46b7f927fbe..4fb62edcd41 100644
--- a/src/tests/unit/tests/DetailsView/components/test-step-view.test.tsx
+++ b/src/tests/unit/tests/DetailsView/components/test-step-view.test.tsx
@@ -6,9 +6,17 @@ import { CollapsibleComponent } from 'common/components/collapsible-component';
 import { ManualTestStatus } from 'common/types/manual-test-status';
 import { VisualizationType } from 'common/types/visualization-type';
 import { AssessmentInstanceTable } from 'DetailsView/components/assessment-instance-table';
+import {
+    AssessmentViewUpdateHandler,
+    AssessmentViewUpdateHandlerProps,
+} from 'DetailsView/components/assessment-view-update-handler';
 import { AssessmentVisualizationEnabledToggle } from 'DetailsView/components/assessment-visualization-enabled-toggle';
 import { ManualTestStepView } from 'DetailsView/components/manual-test-step-view';
-import { TestStepView, TestStepViewProps } from 'DetailsView/components/test-step-view';
+import {
+    TestStepView,
+    TestStepViewDeps,
+    TestStepViewProps,
+} from 'DetailsView/components/test-step-view';
 import * as styles from 'DetailsView/components/test-step-view.scss';
 import { AssessmentInstanceTableHandler } from 'DetailsView/handlers/assessment-instance-table-handler';
 import * as Enzyme from 'enzyme';
@@ -17,12 +25,14 @@ import { BaseDataBuilder } from 'tests/unit/common/base-data-builder';
 import { IMock, It, Mock, MockBehavior, Times } from 'typemoq';
 
 let getVisualHelperToggleMock: IMock<(provider, props) => {}>;
+let updateHandlerMock: IMock<AssessmentViewUpdateHandler>;
 
 describe('TestStepViewTest', () => {
     beforeEach(() => {
         getVisualHelperToggleMock = Mock.ofInstance((provider, props) => {
             return null;
         });
+        updateHandlerMock = Mock.ofType<AssessmentViewUpdateHandler>();
     });
 
     test('constructor, no side effects', () => {
@@ -135,6 +145,55 @@ describe('TestStepViewTest', () => {
         expect(wrapper.debug()).toMatchSnapshot();
     });
 
+    test('componentDidUpdate', () => {
+        const props = TestStepViewPropsBuilder.defaultProps(
+            getVisualHelperToggleMock.object,
+        ).build();
+        const prevProps = TestStepViewPropsBuilder.defaultProps(
+            getVisualHelperToggleMock.object,
+        ).build();
+        prevProps.assessmentNavState.selectedTestSubview = 'prevTestStep';
+        updateHandlerMock
+            .setup(u => u.update(getUpdateHandlerProps(prevProps), getUpdateHandlerProps(props)))
+            .verifiable(Times.once());
+
+        const testObject = new TestStepView(props);
+
+        testObject.componentDidUpdate(prevProps);
+
+        updateHandlerMock.verifyAll();
+    });
+
+    test('componentDidMount', () => {
+        const props = TestStepViewPropsBuilder.defaultProps(
+            getVisualHelperToggleMock.object,
+        ).build();
+        updateHandlerMock
+            .setup(u => u.onMount(getUpdateHandlerProps(props)))
+            .verifiable(Times.once());
+
+        const testObject = new TestStepView(props);
+
+        testObject.componentDidMount();
+
+        updateHandlerMock.verifyAll();
+    });
+
+    test('componentWillUnmount', () => {
+        const props = TestStepViewPropsBuilder.defaultProps(
+            getVisualHelperToggleMock.object,
+        ).build();
+        updateHandlerMock
+            .setup(u => u.onUnmount(getUpdateHandlerProps(props)))
+            .verifiable(Times.once());
+
+        const testObject = new TestStepView(props);
+
+        testObject.componentWillUnmount();
+
+        updateHandlerMock.verifyAll();
+    });
+
     function validateManualTestStepView(
         wrapper: Enzyme.ShallowWrapper,
         props: TestStepViewProps,
@@ -149,6 +208,17 @@ describe('TestStepViewTest', () => {
         );
         expect(props.assessmentsProvider).toEqual(view.prop('assessmentsProvider'));
     }
+
+    function getUpdateHandlerProps(props: TestStepViewProps): AssessmentViewUpdateHandlerProps {
+        return {
+            deps: props.deps,
+            isRequirementEnabled: props.isStepEnabled,
+            assessmentNavState: props.assessmentNavState,
+            assessmentData: props.assessmentData,
+            prevTarget: props.prevTarget,
+            currentTarget: props.currentTarget,
+        };
+    }
 });
 
 class TestStepViewPropsBuilder extends BaseDataBuilder<TestStepViewProps> {
@@ -219,7 +289,10 @@ class TestStepViewPropsBuilder extends BaseDataBuilder<TestStepViewProps> {
                 howToTest: <p>Instructions</p>,
                 isManual: false,
                 guidanceLinks: [],
-            });
+            })
+            .with('deps', {
+                assessmentViewUpdateHandler: updateHandlerMock.object,
+            } as TestStepViewDeps);
     }
 
     public withNoGetToggleConfig(): TestStepViewPropsBuilder {