My Scenario - Upon entering a value in frame counter and hit return key, the video should play at the mentioned interval.

How do I replicate this at browser console using JS selector? Below is the copied html of the input frame counter?

Note: I am a beginner to WebDev and stackoverflow. Kindly excuse if the question is not framed properly.

<div>
              <ap-timeline-time-input data-timeline-child="true" value="200"></ap-timeline-time-input>
              <!--?lit$5695349277$-->
            </div>
<ap-timeline-time-input data-timeline-child="true" value="200"></ap-timeline-time-input>
shadow-root (open)
<form class="time-input-edit hidden">
        <!-- input attribute "size" here is a fix for browser default width
        of the input element making the component width jumpy between edit
        and view mode -->
        <input size="1" value="200">
        <span class="error"><!--?lit$5695349277$--></span>
      </form>

What I tried - Using the below js path of the input field, I am able to enter the value which reflects in the field. However it video does not get jump to the frame to the new value. only if I click anywhere in the field it works as expected.

document.querySelector("body > app-root > app-qc-route > app-qc > div > app-workspace-outlet > app-workspace-split-layout > ap-split-pane > div:nth-child(2) > app-workspace-outlet > app-workspace-timeline-panel > div > div.timeline.mono-mix-padding-right > app-qc-timeline > app-timeline-base > ap-timeline-basic").shadowRoot.querySelector("ap-timeline > ap-timeline-row.alternate-background.timestamps.overflow-hack-right > span > div > ap-timeline-time-input").value="900"