Jump to content

Parsoid/Parser Unification/Cite CSS: Difference between revisions

From mediawiki.org
Content deleted Content added
Simplify and update based on deployed code till now.
Line 67: Line 67:
Yes. If you open a page that has citations in VisualEditor, and the citations on the page render differently from outside VE, then your wiki either needs language-specific CSS rules (which we have handled via [[phab:T156350|T156350]] as above), or it needs CSS rules to be added to <code>MediaWiki:Common.css</code> which you will need to add. You can check whether your wiki has site-specific overrides in the <code>MediaWiki</code> namespace to determine if you need to add CSS rules in <code>MediaWiki:Common.css</code>.
Yes. If you open a page that has citations in VisualEditor, and the citations on the page render differently from outside VE, then your wiki either needs language-specific CSS rules (which we have handled via [[phab:T156350|T156350]] as above), or it needs CSS rules to be added to <code>MediaWiki:Common.css</code> which you will need to add. You can check whether your wiki has site-specific overrides in the <code>MediaWiki</code> namespace to determine if you need to add CSS rules in <code>MediaWiki:Common.css</code>.


== Is there any help with writing these CSS rules? ==
== Is there any help writing these CSS rules? ==
Yes, see below.
Yes, we have some useful resources for you to write up these rules.

You can use these as starting points to update your wiki's <code>MediaWiki:Common.css</code> . Depending on how your wiki's CSS is structured, you may not necessarily want to copy-paste these exact rules into your wiki, but those rules will hopefully make it quicker to update your wiki's CSS.


=== Programmatically generated CSS rules ===
=== Programmatically generated CSS rules ===
The Content Transform Team has written scripts to process existing site messages and language localization messages to programmatically generate CSS rules for a wiki's Common.css file. As part of visual diff testing, we have tested these rules and tweaked them a bit - mostly where the script couldn't get the CSS right to the last detail. You can see '''[[gerrit:plugins/gitiles/integration/visualdiff/+/cc0d73a292ca509b98369a0deeff1edf064b5e90/lib/parsoid.custom_styles.yaml|these rules here]]'''. For most wikis, these rules should work out of the box.
We wrote a script to process all the localization messages (on wiki and in the Cite extension) and generated CSS rules for your wiki.

=== Verifying changes ===
Open a page in VisualEditor (after ensuring caches are purged) to see if the CSS fixes have improved the rendering of citations.

== How do we plan to roll out these changes? ==
We would ideally like to see these changes rolled out everywhere by Feb 28, 2023.

Since this is primarily a change in how Cite localization is configured on wikis, the Content Transform Team is proposing to take on the task of adding the CSS rules to <code>MediaWiki:Common.css</code> on your wiki and verifying the changes. This might be especially beneficial to wikis that may not have the volunteer / technical resources available to roll out, test, and tweak the changes.

We will make an announcement on Tech News (and possibly other available venues as appropriate) with a link to this page and specifically, this proposal. If you are a wiki that prefers to make changes yourself, please add yourself to the list below. For these wikis, we are still around to assist and help and will follow up as appropriate to ensure these changes are made in a timely manner.


=== Wikis preferring to make their own changes ===
As part of visual diff testing, we have had to add a number of these CSS rules to the testing repo. These include the script-generated CSS for wikis and add corrections / tweaks where the script couldn't get the CSS right to the last detail. You can see '''[[gerrit:plugins/gitiles/integration/visualdiff/+/cc0d73a292ca509b98369a0deeff1edf064b5e90/lib/parsoid.custom_styles.yaml|these rules here]]''' . For most wikis, these rules should work out of the box.
If you are a wiki that prefers to roll out and test these changes yourself, please add it to the list below.


* ...
== How can we verify changes? ==
* ...
As above, you can open the page in VisualEditor (after ensuring caches are purged) to see if your CSS fixes have improved the rendering of citations.


== Reporting bugs ==
== Reporting bugs ==

Revision as of 22:26, 17 January 2023

Like all extensions, the Cite extension has localized messages. However, a significant portion of the localized messages are for formatting and for localizing the numbering scheme.

Parsoid takes a different approach than the legacy parser and uses CSS to do the number-format-specific localization of the Cite extension. One of the reasons for this approach is to ensure a good editing experience in editing clients like VisualEditor. When citations are modified (added / removed), using CSS ensures that the numbers adjust automatically and consistently. Otherwise, VE (and other clients) would have to make a server request to re-render all citations each time one is added or removed which can make for a poor and inefficient experience.

Wikis should add appropriate CSS rules to their MediaWiki:Common.css file to ensure proper localization of citations in Visual Editor, given this difference in how citation number localization is done. This will become even more important as we start to migrate toward the use of Parsoid HTML for readers, not just for editing.

Which wikis are impacted?

Pretty much any wiki that uses localized numbering schemes will be impacted.

There are three sources for localization:

  1. Language-specific counters in MediaWiki core
  2. Language-specific localization messages in the Cite extension repository
  3. Message overrides defined in the MediaWiki namespace on the wiki.

Any wiki that uses localized numbers on wiki might be impacted. Additionally, any wiki using a language that provides a localized message for one of these Cite extension messages may need CSS rules for Parsoid HTML

  • cite_reference_link
  • cite_references_link_many_format
  • cite_references_link_many_format_backlink_labels
  • cite_references_link_one
  • cite_references_link_many
  • cite_references_link_many_sep
  • cite_references_link_many_and
  • messages with "Cite_link_label_group-" prefix.

Example: For language br and message cite_references_link_many_format in order to determine if your language is affected, you should check to see if https://<your wiki>/wiki/MediaWiki:Cite_references_link_many_format has non-default content; this should include both wiki-specific overrides as well as any defaults set in i18n/<language code>.json in the Cite extension repository.

Localized language counters in MediaWiki core

The Content Transform Team has addressed this via T156350 and these rules will be available for all these language wikis on all projects. We have defined language-specific counters that had localized counters defined in MediaWki and deployed them (Ex: arabic, bengali).

Localized Cite messages on a wiki

Some wikis further localize citation formatting by using message overrides in the MediaWiki namespace on that wiki.

Here is the list of 157 wikis that have some site message defined for Cite.

Project List of wikis
Wikipedia acewiki, amwiki, arywiki, arzwiki, azbwiki, azwiki, be-taraskwiki, bgwiki, bjnwiki, bnwiki, bswiki, cewiki, ckbwiki, cswiki, cvwiki, dawiki, dewiki, eowiki, eswiki, euwiki, fawiki, frpwiki, frwiki, glwiki, guwiki, hewiki, hiwiki, hrwiki, idwiki, ilowiki, iuwiki, jvwiki, kawiki, kkwiki, kowiki, kuwiki, kvwiki, ladwiki, lnwiki, minwiki, mrwiki, mswiki, mtwiki, ndswiki, nowiki, nvwiki, ocwiki, pagwiki, rowiki, scnwiki, scowiki, shwiki, skwiki, slwiki, sqwiki, srwiki, suwiki, svwiki, testwiki, tgwiki, tiwiki, trwiki, urwiki, yiwiki, zhwiki, arwiki, fiwiki, huwiki, itwiki, jawiki, nlwiki, plwiki, ptwiki, ruwiki, ukwiki, viwiki, enwiki, bewiki, cawiki, cywiki, elwiki, etwiki, fowiki, hywiki, iswiki, ltwiki, lvwiki, mlwiki, mnwiki, newiki, nnwiki, orwiki, simplewiki, tawiki, thwiki, tlwiki, zh-yuewiki
Wikiquote afwikiquote, enwikiquote, eswikiquote, glwikiquote, hewikiquote, hrwikiquote, itwikiquote, kawikiquote, ruwikiquote, sqwikiquote, ukwikiquote, viwikiquote
Wikisource cswikisource, dewikisource, fiwikisource, frwikisource, glwikisource, hewikisource, hrwikisource, itwikisource, ruwikisource, vecwikisource, viwikisource, zhwikisource, eswikisource, plwikisource, wikisource, srwikisource
Wikitionary bswiktionary, dewiktionary, enwiktionary, eswiktionary, frwiktionary, hrwiktionary, kuwiktionary, ocwiktionary, svwiktionary, trwiktionary, viwiktionary, zhwiktionary, gdwiktionary
Wikibooks enwikibooks, glwikibooks, hewikibooks, jawikibooks, kawikibooks, nowikibooks, ruwikibooks, slwikibooks, viwikibooks
Wikinews hewikinews, ukwikinews
Wikivoyage ruwikivoyage, eswikivoyage, trwikivoyage
Affiliate wikis ruwikimedia, uawikimedia
Other metawiki, commons

Is there a way to see if my wiki is impacted?

Yes. If you open a page that has citations in VisualEditor, and the citations on the page render differently from outside VE, then your wiki either needs language-specific CSS rules (which we have handled via T156350 as above), or it needs CSS rules to be added to MediaWiki:Common.css which you will need to add. You can check whether your wiki has site-specific overrides in the MediaWiki namespace to determine if you need to add CSS rules in MediaWiki:Common.css.

Is there any help writing these CSS rules?

Yes, see below.

Programmatically generated CSS rules

The Content Transform Team has written scripts to process existing site messages and language localization messages to programmatically generate CSS rules for a wiki's Common.css file. As part of visual diff testing, we have tested these rules and tweaked them a bit - mostly where the script couldn't get the CSS right to the last detail. You can see these rules here. For most wikis, these rules should work out of the box.

Verifying changes

Open a page in VisualEditor (after ensuring caches are purged) to see if the CSS fixes have improved the rendering of citations.

How do we plan to roll out these changes?

We would ideally like to see these changes rolled out everywhere by Feb 28, 2023.

Since this is primarily a change in how Cite localization is configured on wikis, the Content Transform Team is proposing to take on the task of adding the CSS rules to MediaWiki:Common.css on your wiki and verifying the changes. This might be especially beneficial to wikis that may not have the volunteer / technical resources available to roll out, test, and tweak the changes.

We will make an announcement on Tech News (and possibly other available venues as appropriate) with a link to this page and specifically, this proposal. If you are a wiki that prefers to make changes yourself, please add yourself to the list below. For these wikis, we are still around to assist and help and will follow up as appropriate to ensure these changes are made in a timely manner.

Wikis preferring to make their own changes

If you are a wiki that prefers to roll out and test these changes yourself, please add it to the list below.

  • ...
  • ...

Reporting bugs

You can report bugs on Phabricator - please use the Parsoid or Parsoid-Read-Views tag to report your bugs.

Asking for help

You can reach out to the Content Transform Team by posting via the Talk page for this page. You may also be able to find us on IRC, but the talk page is probably the best place since the responses there might also help others.