WebView windows reload on refocus

[prozilla]

WebView windows reload on refocus

[Prozilla]

Potential implementation for solution #2: Use memo to wrap the iframe to prevent re-rendering (https://react.dev/reference/react/memo).

[Prozilla]

Note: this also causes an additional bug that prevents a unfocused window from closing when the user clicks on it. The window becomes focused instead of closed. This can easily be fixed by only calling the refocus function if the click doesn't happen on the close button.

[Prozilla]

These bugs are caused by each item in the array re-rendering when the order changes (when the focused window changed), this is because the index was used as the key for each item in the array. This can be solved by using a unique id instead of the index.

I also recommend using this eslint rule to prevent these issues from reoccurring: https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/no-array-index-key.md#prevent-usage-of-array-index-in-keys-reactno-array-index-key

[Prozilla]

Note: this also causes an additional bug that prevents a unfocused window from closing when the user clicks on it. The window becomes focused instead of closed. This can easily be fixed by only calling the refocus function if the click doesn't happen on the close button.

This issue (unfocused windows not closing) has now been solved: 271338c

As for the other issue: Adding a unique key to the array item did not fix it.

Edit: further investigation has proven all previous assumption to be false. The webviews do not reload when they change from unfocused to focused. They only reload when the user starts dragging the window around.