Page MenuHomePhabricator

Add .mw-parser-output as a potential selector
Closed, DeclinedPublic

Description

In TemplateStyles, I ran into a case where I wanted to select .mw-parser-output directly. The stupid solution doesn't work:

.mw-parser-output {
	background: #FAFCFC;
	border-radius: 8px; 
	border-left: #006666 solid 5px;
	border-top: #006666 solid 5px;
	border-right: #660033 solid 5px;
	border-bottom: #660033 solid 5px;
	padding: 8px;
	font-size: 100%;
}

where the output is .mw-parser-output .mw-parser-output { ... } which doesn't work because I was shooting for a doubled class selector, not the descendant combinator. Neither does the crafty solution:

body.rootpage-User_Iridescent {
    ...
}

which results in CSS that looks like .mw-parser-output body.rootpage-User_Iridescent { ... }. Which obviously doesn't work.

The expected output in each case was .mw-parser-output.mw-parser-output { ... } or body.rootpage-User_Iridescent .mw-parser-output { ... }. Probably should consider both in general anyway.

This is very much an edge case and it's not exactly something I'd like to see in the wild (if indeed it should be supported, or if in fact was discounted at an earlier date). The particular conversation which invoked this request is this request by WAID, where the user in question has a classic talk page styled-and-unclosed div presumably preventing her from using the Reply Tool. The div in question is in User:Iridescent/Talk header, transcluded to User talk:Iridescent. This solution would have allowed me to remove that div. (I can see no other reason why she should be prevented on that page.)

Tagged for DiscussionTools because maybe, just maybe, there's some other root cause going on there. Or the tool should be able to tell what's going on, or something. :)

Event Timeline

Izno renamed this task from Add (div).mw.parser-output as a potential selector to Add .mw.parser-output as a potential selector.Jan 8 2021, 8:59 PM
Izno updated the task description. (Show Details)
DannyS712 renamed this task from Add .mw.parser-output as a potential selector to Add .mw-parser-output as a potential selector.Jan 8 2021, 9:32 PM

I’d also like to see a such feature, but I’m also concerned about allowing it to be used by anyone. Constraining it to interface admins could be done through T17075 (simply create a CSS-only gadget that applies this rule), once—and in case—it’s implemented.

Yeah, TemplateStyles forces selecting something inside the parser output, not the parser output wrapper itself. Changing that doesn't seem dangerous (although custom user page wrappers are a bit of an abomination IMO).

Yeah, TemplateStyles forces selecting something inside the parser output, not the parser output wrapper itself. Changing that doesn't seem dangerous

Yeah, doesn't seem dangerous to me. I can't think of any particular abuse that you could do with the wrapper that you couldn't already do inside it, seeing as it's not the scaffolding or anything on the page structure.

although custom user page wrappers are a bit of an abomination IMO.

Yeah, but it's not the only page I've seen it on. I don't know if it's worth supporting. I know parser team looks on them somewhat askance. :^)

From DiscussionTools' perspective, the problem isn't the unclosed <div>, but rather the fact that it comes from a transcluded page, which makes the transclusion cover the entire page (until the automatically generated closing tag at the end). If the same <div> was directly on the page rather than transcluded, DiscussionTools should work.

Is there a well-justified use case for this? Other than colouring the whole page in a different colour, I mean. Allowing people to attach generic styles to the container itself seems like a potential problem with separation of concerns.

Is there a well-justified use case for this? Other than colouring the whole page in a different colour, I mean. Allowing people to attach generic styles to the container itself seems like a potential problem with separation of concerns.

Well, not just colors; whole page fonts in general as well as background colors... which is basically CSS anyway for most people. I haven't seen a use in my travels but I mostly work on en.wp. It might be appreciated on e.g. Wikisource.

With Page Forms and multiple templates on a page, you would like to do something like use flexbox to position them in a certain way. But you can't do that because you can't put a container element around the templates without breaking page forms.

I think this probably needs some level of agreement that this is a good idea, so I don't think good first task is a good tag for it. ("Tasks are self-contained, non-controversial issues with a clear approach.", emphasis mine.)

As one particular BEANSy thing to do, it would be more trivial to disrupt a page with something like display: flex with something like this, but that's doable even without being able to target mw-parser-output.

I don't think we should allow .mw-parser-output to be styled directly. It was intentionally created such that it allows a logical restriction to be placed upon its contents with no display or semantic meaning on itself. If we were to allow this, your styles would work only for the article container and now anywhere else. This class is meant to be used quite a lot without those container elements being expected to change their styling at same time.

In terms of layout, it should suffice I think to wrap such pages in an element that has the styling in question without it affecting the page element. This also can't be allowed for security reasons since we need to be able to apply overflow and z-index on these reliably, for example, also for skins to be able to position containers such as indicators, site notices, or in VisualEditor modal dialogs.

After thinking about it again, IMO:

  1. There is no compelling use case for this feature. The only thing that came up is custom styling for user talk pages, which I don't think is an important one (it arose due to a glitch of the parser, not because anyone thought it's something that should be possible).
  2. Since the CSS properties of .mw-parser-output and its parents are somewhat security-sensitive (see T40848 for more details), making it user-stylable would mean skin maintainers would have to review whether their security assumptions still hold. That's way more work than anyone is likely willing to invest into this task, especially given that TemplateStyles is not actively maintained and when occasionally someone has some time to spend on it, there are much more impactful things to do (e.g. allowing more CSS properties).
  3. Auto-prefixing selectors is itself somewhat secuity-sensitive, already nontrivial because of the html/body hoisting rules, and this would make it more complex. Nothing sever, but given the lack of convincing use cases, that doesn't look like a worthy tradeoff.

Feel free to reopen if you feel you can convince someone to work on the issues above.

The only thing that came up is custom styling for user talk pages

I did present another use case with page forms. It doesn't change the conclusion though, because I think it can be worked around by using https://www.mediawiki.org/wiki/Extension:Page_Forms/Defining_forms#Embedded_templates

Those use cases could maybe also be solved with something along the "header" and "footer" type elements that are in wikisource pages maybe? The use cases being described aren't really so much about styling that element, but being able to have have a section above and below the wikitext that isn't disturbed by editing the primary wikitext; such section could certainly still be wikitext itself.

I don't know much about PageForms, but that sounds like a limitation of the extension - if you want to lay out a set of templates in a certain way, surely you'd want to put them into some kind of container (which can use different classes for different layouts, can coexist with other blocks etc) instead of relying on static styles on the entire content block?