Live preview doesn't work with Vector 2022 skin
Closed, ResolvedPublicBUG REPORT
Actions

Assigned To

Authored By

	Jdlrobson
	Feb 2 2022, 10:48 PM

Description

The live preview feature when enabled

Screen Shot 2022-02-02 at 2.43.53 PM.png (322×816 px, 35 KB)

makes various assumptions about the HTML of the page
when I edit https://fr.wikipedia.org/w/index.php?title=Utilisateur:Jon_(WMF)/draft&action=edit:

Screen Shot 2022-02-02 at 2.44.33 PM.png (1×2 px, 294 KB)

This results in the max width applying twice.

QA steps

QA in production.

Visit https://he.wikipedia.org/wiki/%D7%9E%D7%99%D7%95%D7%97%D7%93:%D7%94%D7%A2%D7%93%D7%A4%D7%95%D7%AA?uselang=en#mw-prefsection-editing and select "Show previews without reloading the page"
Visit https://he.wikipedia.org/w/index.php?title=%D7%9E%D7%A9%D7%AA%D7%9E%D7%A9:Jdlrobson/sandbox&action=edit and click "preview". The preview should show above the edit box without reloading the page.

Developer notes

Looking at https://phabricator.wikimedia.org/source/mediawiki/browse/master/resources/src/mediawiki.action/mediawiki.action.edit.preview.js$44 it makes all sorts of assumptions about the HTML, for example how indicators and categories apply.

On the short term this feature should probably not be loaded on modern Vector:
https://gerrit.wikimedia.org/g/mediawiki/core/+/55a2f2be4da70298e45cdc605059ca6e8753fe5d/includes/EditPage.php#2637

On long term, we should avoid making all these brittle assumptions about the HTML and add a proper API for making such changes.

Details

Subject	Repo	Branch	Lines +/-
Drop skin override	mediawiki/skins/Vector	master	+0 -20
Drop skin override	mediawiki/skins/Vector	wmf/1.38.0-wmf.20	+0 -20
Update skin checks with new vector skin key.	mediawiki/extensions/ContentTranslation	wmf/1.38.0-wmf.20	+1 -1
Update skin checks with new vector skin key.	mediawiki/extensions/ContentTranslation	master	+1 -1

Customize query in gerrit

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Open		None	T41272 Bugs in "Live preview" feature (tracking)
		Resolved	BUG REPORT	Jdlrobson	T300814 Live preview doesn't work with Vector 2022 skin

Event Timeline

Jdlrobson created this task.Feb 2 2022, 10:48 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptFeb 2 2022, 10:48 PM

Jdlrobson added a parent task: T41272: Bugs in "Live preview" feature (tracking).Feb 2 2022, 10:48 PM

Same issue encountered here, the feature was working well yesterday (2 Feb 2022) but became broken today. Please rollback the changes, it isn't ready for 2010 wikitext editor yet.

Here https://upload.wikimedia.org/wikipedia/commons/2/2e/Vector-2022-preview-problem.webp is an recording of how the function looks like now.

ovasileva triaged this task as Medium priority.Feb 3 2022, 8:58 AM

ovasileva added a project: Web-Team-Backlog (Kanbanana-FY-2021-22).

it makes all sorts of assumptions about the HTML, for example how indicators and categories apply.

It does, but that is not why it is failing so horridly. It is because the preview loads vector styles, because content varies on skin (See also T130632). And remember how the JS is lying about the skin that it is using???

the parse API call has a useskin: mw.config.get('skin') and this inadvertently now loads the CSS for the original Vector skin.

Nardog subscribed.Feb 3 2022, 10:20 AM

Thanks for the added context @TheDJ. So yeh looks like that was a bad idea on my part. I was hoping to keep compatibility with gadgets checking mw.config.get('skin') but I hadn't considered it might be passed to the API. Will post patch(es).

Change 753193 had a related patch set uploaded (by Jdlrobson; author: Clare Ming):

[mediawiki/extensions/ContentTranslation@master] Update skin checks with new vector skin key.

https://gerrit.wikimedia.org/r/753193

Change 759531 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Drop skin override

https://gerrit.wikimedia.org/r/759531

Change 753193 merged by jenkins-bot:

[mediawiki/extensions/ContentTranslation@master] Update skin checks with new vector skin key.

https://gerrit.wikimedia.org/r/753193

ReleaseTaggerBot added a project: MW-1.38-notes (1.38.0-wmf.21; 2022-02-07).Feb 3 2022, 5:00 PM

Change 759313 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@wmf/1.38.0-wmf.20] Drop skin override

https://gerrit.wikimedia.org/r/759313

Change 759314 had a related patch set uploaded (by Jdlrobson; author: Clare Ming):

[mediawiki/extensions/ContentTranslation@wmf/1.38.0-wmf.20] Update skin checks with new vector skin key.

https://gerrit.wikimedia.org/r/759314

Jdlrobson moved this task from Needs Analysis to Code Review on the Web-Team-Backlog (Kanbanana-FY-2021-22) board.Feb 3 2022, 6:08 PM

Change 759313 abandoned by Jdlrobson:

[mediawiki/skins/Vector@wmf/1.38.0-wmf.20] Drop skin override

Reason:

lemme try that again..

https://gerrit.wikimedia.org/r/759313

Change 759313 restored by Jdlrobson:

[mediawiki/skins/Vector@wmf/1.38.0-wmf.20] Drop skin override

https://gerrit.wikimedia.org/r/759313

Change 759314 merged by jenkins-bot:

[mediawiki/extensions/ContentTranslation@wmf/1.38.0-wmf.20] Update skin checks with new vector skin key.

https://gerrit.wikimedia.org/r/759314

Mentioned in SAL (#wikimedia-operations) [2022-02-03T19:33:15Z] <taavi@deploy1002> Synchronized php-1.38.0-wmf.20/extensions/ContentTranslation/modules/entrypoints/ext.cx.entrypoints.contributionsmenu.js: Backport: [[gerrit:759314|Update skin checks with new vector skin key. (T298916 T300814)]] (duration: 00m 50s)

ReleaseTaggerBot edited projects, added MW-1.38-notes (1.38.0-wmf.20; 2022-01-31); removed MW-1.38-notes (1.38.0-wmf.21; 2022-02-07).Feb 3 2022, 8:00 PM

Change 759313 merged by jenkins-bot:

[mediawiki/skins/Vector@wmf/1.38.0-wmf.20] Drop skin override

https://gerrit.wikimedia.org/r/759313

Mentioned in SAL (#wikimedia-operations) [2022-02-03T20:06:26Z] <taavi@deploy1002> Synchronized php-1.38.0-wmf.20/skins/Vector/skin.json: Backport: [[gerrit:759313|Drop skin override (T300814)]] (1/2) (duration: 00m 49s)

Change 759531 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Drop skin override

https://gerrit.wikimedia.org/r/759531

Mentioned in SAL (#wikimedia-operations) [2022-02-03T20:07:19Z] <taavi@deploy1002> Synchronized php-1.38.0-wmf.20/skins/Vector/includes/Hooks.php: Backport: [[gerrit:759313|Drop skin override (T300814)]] (2/2) (duration: 00m 49s)

Jdlrobson moved this task from Code Review to QA in Prod on the Web-Team-Backlog (Kanbanana-FY-2021-22) board.Feb 3 2022, 8:09 PM

Jdlrobson updated the task description. (Show Details)

ReleaseTaggerBot edited projects, added MW-1.38-notes (1.38.0-wmf.21; 2022-02-07); removed MW-1.38-notes (1.38.0-wmf.20; 2022-01-31).Feb 3 2022, 9:00 PM

Note: live preview makes a lot of assumptions on the styling of legacy vector meaning this is still fragile and we should review when discussing the upcoming navigational changes

ChhTJ096 subscribed.Feb 9 2022, 3:14 PM

bwang claimed this task.Feb 17 2022, 6:16 PM

Fix passes in production
https://phabricator.wikimedia.org/F34954682

bwang moved this task from QA in Prod to Ready for Signoff on the Web-Team-Backlog (Kanbanana-FY-2021-22) board.Feb 17 2022, 6:33 PM

bwang removed bwang as the assignee of this task.Feb 22 2022, 6:12 PM

bwang subscribed.

LGoto assigned this task to cjming.Feb 24 2022, 6:10 PM