fix: scroll - add missing init method for window.name method of scroll restoring - fixes #1586 #1457 #1457

Author: shakyShane

client/lib/effects/set-scroll.ts

@@ -135,7 +135,7 @@ export function setScrollEffect(
 }
 
 function scrollElement(element, scrollProportionally, event: IncomingPayload) {
-    if (scrollProportionally) {
+    if (scrollProportionally && element.scrollTo) {
         return element.scrollTo(
             0,
             element.scrollHeight * event.position.proportional

client/lib/index.ts

@@ -10,15 +10,14 @@ import { merge } from "rxjs/observable/merge";
 import { initLogger, logHandler$ } from "./log";
 import { effectOutputHandlers$ } from "./effects";
 import { Nanologger } from "../vendor/logger";
-import { scrollRestoreHandlers$ } from "./scroll-restore";
+import { scrollRestoreHandlers$, initWindowName } from "./scroll-restore";
 import { initListeners } from "./listeners";
 import { groupBy } from "rxjs/operators/groupBy";
 import { withLatestFrom } from "rxjs/operators/withLatestFrom";
 import { mergeMap } from "rxjs/operators/mergeMap";
 import { share } from "rxjs/operators/share";
 import { filter } from "rxjs/operators/filter";
 import { pluck } from "rxjs/operators/pluck";
-import { tap } from "rxjs/operators/tap";
 import { of } from "rxjs/observable/of";
 
 export interface Inputs {
@@ -35,6 +34,7 @@ export interface Inputs {
 
 const window$ = initWindow();
 const document$ = initDocument();
+const names$ = initWindowName(window);
 const { socket$, io$ } = initSocket();
 const option$ = initOptions();
 const navigator$ = of(navigator);
@@ -86,7 +86,10 @@ const output$ = getStream("[socket]", inputs)(
 );
 
 const effect$ = getStream("[effect]", inputs)(combinedEffectHandler$, output$);
-const dom$ = getStream("[dom-effect]", inputs)(domHandlers$, effect$);
+const dom$ = getStream("[dom-effect]", inputs)(
+    domHandlers$,
+    merge(effect$, names$)
+);
 
 const merged$ = merge(output$, effect$, dom$);
 

client/lib/scroll-restore.ts

@@ -7,15 +7,24 @@ import { empty } from "rxjs/observable/empty";
 import { of } from "rxjs/observable/of";
 import * as Log from "./log";
 import { withLatestFrom } from "rxjs/operators/withLatestFrom";
-import { take } from "rxjs/operators/take";
-import { mergeMap } from "rxjs/operators/mergeMap";
 import { map } from "rxjs/operators/map";
 import { setWindowName } from "./dom-effects/set-window-name.dom-effect";
 import { setScroll } from "./dom-effects/set-scroll.dom-effect";
 
 export const PREFIX = "<<BS_START>>";
 export const SUFFIX = "<<BS_START>>";
-export const regex = new RegExp(PREFIX + "(.+?)" + SUFFIX);
+export const regex = new RegExp(PREFIX + "(.+?)" + SUFFIX, "g");
+
+function parseFromString(input: string): any {
+    var match;
+    var last;
+    while ((match = regex.exec(input))) {
+        last = match[1];
+    }
+    if (last) {
+        return JSON.parse(last);
+    }
+}
 
 export function initWindowName(window: Window) {
     const saved = (() => {
@@ -24,10 +33,7 @@ export function initWindowName(window: Window) {
          * BS json blob & parse it.
          */
         try {
-            const json = window.name.match(regex);
-            if (json) {
-                return JSON.parse(json[1]);
-            }
+            return parseFromString(window.name);
         } catch (e) {
             return {};
         }

cypress.json

@@ -1,3 +1,3 @@
 {
-  "videoRecording": false
+  "video": false
 }