When editing wiki, have diff and preview in separate scrollable elements

[vadosnaprimer]

If the wiki page is big and you need to check how your edit will look multiple times, scrolling all the way back and forth becomes a problem, because you have to find the needed part of the text every time. If it was possible to scroll to the desired spot once and then just look up or down, it'd be ideal.

Of course diff and preview being visible may still require a bit pf page scrolling, but it's okay since it won't be a lot, and the desired place still shows up in individual views.

[Masterjun3]

Scrollable elements are not good for mobile at all. See #399 and #616 .

[adelikat]

What about making the diff collapsable? also maybe it should go below the preview? thoughts?

[vadosnaprimer]

Diff is not so bad because it doesn't show the full page. And if it's moved below the preview, the preview scrolling problem remains the same.

[YoshiRulz]

MediaWiki handles this by showing the preview and diff in what are effectively 2 tab panes. (This single button toggles between them.)

That's with VisualEditor. In the classic editor, clicking the preview or show diff button reloads the page to include the chosen view—they can't be used together. Page reloads are a bit annoying, but I often pull out the classic editor because I prefer having the preview in-line with (below) the edit pane, as TASVideos does, rather than as a modal.
So I think you should add Bootstrap's tab control to the current design, though it wouldn't address the issue with scrolling down to the relevant part of the preview. FWIW MediaWiki also suffers from that. It's hard to infer the user's intent.

[Masterjun3]

To solve the inital problem of this issue ticket, we could also make use of the good old browser features like pop-up windows.
We could have an option to open the preview in a new window, and then refresh that window whenever the user reclicks the Preview button (because the original page that opened the window still has control over the window's contents).

Would that work for this issue ticket?

[vadosnaprimer]

Sounds interesting! Switching tabs while both of them are scrolled to the needed area would be good.

[nattthebear]

we could also make use of the good old browser features like pop-up windows.

Will that give a good mobile experience?

[Masterjun3]

It doesn't need to, because the regular Preview is unaffected. Extra features can be as mobile-unfriendly as we want.