Merge pull request #1429 from bbc/upstream/fix-prompter-slow-after-bootstrap

Author: jstarpl

packages/webui/src/client/ui/Prompter/PrompterView.tsx

@@ -369,7 +369,11 @@ export class PrompterViewContent extends React.Component<Translated<IProps & ITr
 		this._lastAnimation = animate(window.scrollY, scrollToPosition, {
 			duration: 0.4,
 			ease: 'easeOut',
-			onUpdate: (latest) => window.scrollTo({ left: 0, top: latest, behavior: 'instant' }),
+			onUpdate: (latest: number) =>
+				window.scrollTo({
+					top: latest,
+					behavior: 'instant',
+				}),
 		})
 	}
 	listAnchorPositions(startY: number, endY: number, sortDirection = 1): [number, Element][] {
@@ -810,6 +814,7 @@ const PrompterContent = withTranslation()(
 
 					window.scrollBy({
 						top: top - scrollAnchor.offset,
+						behavior: 'instant',
 					})
 					// We've scrolled, exit the function!
 					return
@@ -821,6 +826,7 @@ const PrompterContent = withTranslation()(
 					// the css margins magically does it for us.
 					window.scrollBy({
 						top: top - readPosition,
+						behavior: 'instant',
 					})
 					// We've scrolled, exit the function!
 					return

packages/webui/src/client/ui/Prompter/controller/joycon-device.ts

@@ -126,7 +126,7 @@ export class JoyConController extends ControllerAbstract {
 					break
 				case '2':
 					// go to top
-					window.scrollTo(0, 0)
+					window.scrollTo({ top: 0, behavior: 'instant' })
 					break
 				case '3':
 					// go to following
@@ -152,7 +152,7 @@ export class JoyConController extends ControllerAbstract {
 					break
 				case '1':
 					// go to top
-					window.scrollTo(0, 0)
+					window.scrollTo({ top: 0, behavior: 'instant' })
 					break
 				case '0':
 					// go to following
@@ -183,7 +183,7 @@ export class JoyConController extends ControllerAbstract {
 				case '12':
 				case '3':
 					// go to top
-					window.scrollTo(0, 0)
+					window.scrollTo({ top: 0, behavior: 'instant' })
 					break
 				case '15':
 				case '1':
@@ -352,7 +352,7 @@ export class JoyConController extends ControllerAbstract {
 		const speed = this.calculateSpeed(joycons)
 
 		// update scroll position
-		window.scrollBy(0, speed)
+		window.scrollBy({ top: speed, behavior: 'instant' })
 
 		const scrollPosition = window.scrollY
 		// check for reached end-of-scroll:

packages/webui/src/client/ui/Prompter/controller/keyboard-device.ts

@@ -194,9 +194,9 @@ export class KeyboardController extends ControllerAbstract {
 				const speed = Math.round(this._currentSpeed)
 				if (speed === 0 && Math.abs(dp) < 100) {
 					// go directly to target position:
-					window.scrollBy(0, dp)
+					window.scrollBy({ top: dp, behavior: 'instant' })
 				} else {
-					window.scrollBy(0, speed)
+					window.scrollBy({ top: speed, behavior: 'instant' })
 				}
 
 				const scrollPosition = window.scrollY

packages/webui/src/client/ui/Prompter/controller/midi-pedal-device.ts

@@ -189,7 +189,7 @@ export class MidiPedalController extends ControllerAbstract {
 		if (this.updateSpeedHandle !== null) return
 
 		// update scroll position
-		window.scrollBy(0, this.lastSpeed)
+		window.scrollBy({ top: this.lastSpeed, behavior: 'instant' })
 
 		const scrollPosition = window.scrollY
 		// check for reached end-of-scroll:

packages/webui/src/client/ui/Prompter/controller/mouse-ish-device.ts

@@ -276,7 +276,7 @@ export class MouseIshController extends ControllerAbstract {
 			this._scrollRest = 0
 		}
 
-		window.scrollBy(0, speed)
+		window.scrollBy({ top: speed, behavior: 'instant' })
 
 		scrollPosition = window.scrollY
 

packages/webui/src/client/ui/Prompter/controller/shuttle-keyboard-device.ts

@@ -117,7 +117,7 @@ export class ShuttleKeyboardController extends ControllerAbstract {
 						// jump to top
 						this.lastSpeed = 0
 						this.lastSpeedMapPosition = ShuttleKeyboardController.SPEEDMAPNEUTRALPOSITION
-						window.scrollTo(0, 0)
+						window.scrollTo({ top: 0, behavior: 'instant' })
 						return
 					case 'F11':
 						// jump to live
@@ -175,7 +175,7 @@ export class ShuttleKeyboardController extends ControllerAbstract {
 		if (this.updateSpeedHandle !== null) return
 
 		// update scroll position
-		window.scrollBy(0, this.lastSpeed)
+		window.scrollBy({ top: this.lastSpeed, behavior: 'instant' })
 
 		const scrollPosition = window.scrollY
 		// check for reached end-of-scroll:

packages/webui/src/client/ui/Prompter/controller/shuttle-webhid-device.ts

@@ -146,7 +146,7 @@ export class ShuttleWebHidController extends ControllerAbstract {
 		if (Math.abs(delta) > 1) return // this is a hack because sometimes, right after connecting to the device, the delta would be larger than 1 or -1
 
 		this.resetSpeed()
-		window.scrollBy(0, this.JOG_BASE_MOVEMENT_PX * delta)
+		window.scrollBy({ top: this.JOG_BASE_MOVEMENT_PX * delta, behavior: 'instant' })
 	}
 
 	protected onShuttle(value: number): void {
@@ -162,7 +162,7 @@ export class ShuttleWebHidController extends ControllerAbstract {
 		if (this.updateSpeedHandle !== null) return
 
 		if (this.lastSpeed !== 0) {
-			window.scrollBy(0, this.lastSpeed)
+			window.scrollBy({ top: this.lastSpeed, behavior: 'instant' })
 
 			const scrollPosition = window.scrollY
 			// check for reached end-of-scroll: