Change 578568 had a related patch set uploaded (by Aron Manning; owner: Aron Manning):
[mediawiki/skins/Timeless@master] Fix editor font-size (13px) being too small in comparison to article (15.2px)

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

Subscribing discussion participants from T245476 .

@matmarex Isarra seems to be unavailable for reviewing the patch.

Change 586426 had a related patch set uploaded (by Isarra; owner: Isarra):
[mediawiki/skins/Timeless@master] Make wikitext editor use fonts consistent with rest of content

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

I am so confused... is this about the core editor, or VE's wikitext editor? Or does VE's editor just inherit the core styles regardless, in which case why does it matter and why was it filed against any of that when those are not where the fix should be? And what skin is this for? I don't think any of the mentioned skins have sidebars the same size as the content?

Based on just the title and the fact that this was filed under Timeless, the above patch should fully resolve it for at least core, but the description has me at an utter loss.

In T247325#6033906, @Isarra wrote:

I am so confused... is this about the core editor, or VE's wikitext editor?

All source editors: WikiTextEditor (old), WTE2010 (with toolbar), WTE2017 (VE's New Wikitext Editor - NEW). "Alphabet soup" confusion, indeed.

Or does VE's editor just inherit the core styles regardless,

VE's editor uses styles defined in core:

/* Edit font preference */
.mw-editfont-monospace {
  font-family: monospace, monospace;
}
.mw-editfont-sans-serif {
  font-family: sans-serif;
}
.mw-editfont-serif {
  font-family: serif;
}

in which case why does it matter and why was it filed against any of that when those are not where the fix should be?

I don't follow.

And what skin is this for? I don't think any of the mentioned skins have sidebars the same size as the content?

Just Timeless. The old skins fare well with 13px font-size in the editor, Minerva hacks around this issue. (See parent task T245476)

Based on just the title and the fact that this was filed under Timeless, the above patch should fully resolve it for at least core, but the description has me at an utter loss.

Thank you for finishing this fix.

Change 578568 abandoned by Aron Manning:
Fix editor font-size (13px) being too small in comparison to article (15.2px)

Reason:
Finished in https://gerrit.wikimedia.org/r/c/mediawiki/skins/Timeless/ /586426

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

Change 586426 merged by jenkins-bot:
[mediawiki/skins/Timeless@master] Make wikitext editor use fonts consistent with rest of content

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

Change 578568 restored by Aron Manning:
Fix editor font-size (13px) being too small in comparison to article (15.2px)

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

In T247325#6033906, @Isarra wrote:

I am so confused...
... the description has me at an utter loss.

The following comment from you in the code (emphasis mine):

// Custom font stacks below should fully address this issue regardless

Suggest to me that you blame the font-stack inconsistency for this bug, which is not the case. As defined in the core styles (see above), VisualEditor uses the default monospace/sans-serif/serif browser font. In comparison, the Timeless uses for articles 'Segoe UI' (Windows) or a metrically consistent alternative. The size difference is minor.

The significant problem was the forced 13px font-size, which would not be "fully address" by using Timeless' font-stack.
Is this the cause of the confusion?

@ashley @Isarra the previous patch fixed the WTE2010 (standard) text editor, but not the WTE2017 (VE source editor). See the QA section in the task description.
Reason: WTE2017 styles load after the skin's, overriding it.

In T247325#6034291, @gerritbot wrote:

Change 578568 restored by Aron Manning:
https://gerrit.wikimedia.org/r/578568

I've uploaded a patch for WTE2017 with more specific rules. Please review and merge. Note that the train leaves the station... tomorrow, I guess?

QA first patch (merged)

Test on beta-cluster

WTE2010 source editor

• Set the Skin to Timeless if not done yet.
• Open "Editing" tab in "Preferences" in a new browser tab for efficency.
• Choose all 3 "Edit area font style" options, reload the editor with each option, check the "font-" CSS rules in DevTools.
• For each option, enable "Syntax highlighting" on the toolbar (stylus icon left of "Advanced", forces monospace font).
• Evaluate whether the font size is visually perceived as similar with syntax highlighting enabled and disabled (subjective measure).
• With highlighting enabled check the "font-" CSS rules in DevTools (only necessary once).

WTE2017 VE source editor (NWE)

• Enable "New wikitext mode" in "Beta features" tab.
• Open "Editing" tab in "Preferences" in a new browser tab for efficency.
• Choose all 3 "Edit area font style" options, reload the editor with each option, check the "font-" CSS rules in DevTools.
• For each option, enable "Syntax highlighting" in the hamburger menu (forces monospace font).
• Evaluate whether the font size is visually perceived as similar with syntax highlighting enabled and disabled (subjective measure).
• With highlighting enabled check the "font-" CSS rules in DevTools (only necessary once).

There doesn't appear to be an action for the Editing Team

The first patch fixed the issue for WTE2010, but not for VisualEditor's WTE2017 as reported in the "QA" section in the description.

The second patch for fixing in WTE2017 too is awaiting review: https://gerrit.wikimedia.org/r/578568
Test report on 2nd patch: T247325#6049054

Wow, 15.2px is really, unpleasantly, big... in my opinion anyway. For comparison, the font size in this textbox here on phrabricator, and in most other skins (Vector, Monobook, Modern, Cologne Blue) is 13px.

(To clarify, I'm using the standard wikitext editor)

The difference is also really noticeable when enabling/disabling the code editor, e.g. on .css pages, as that is still using the normal 13px font size

Test results for patch 578568 (not merged yet)

Test locally (git review -d 578568 in Timeless' folder) or on PatchDemo.

WTE2010 source editor

• Log in as "Guest" : "guestguest".
• Set the Skin to Timeless if not done yet.
• Disable "New wikitext mode" in "Beta features" tab.
• Open "Edit area font style" in "Editing" tab in a new browser tab for efficency.
• Choose all 3 "Edit area font style" options, reload the editor with each option, check the "font-" CSS rules in DevTools.
• For each option, enable "Syntax highlighting" in the hamburger menu (forces monospace font). (N/A on PatchDemo)
• Evaluate whether the font size is visually perceived as similar with syntax highlighting enabled and disabled (subjective measure). (N/A on PatchDemo)
• With highlighting enabled check the "font-" CSS rules in DevTools (only necessary once). (N/A on PatchDemo)

WTE2017 VE source editor (NWE)

• Log in as "Guest" : "guestguest".
• Set the Skin to Timeless if not done yet.
• Enable "New wikitext mode" in "Beta features" tab.
• Open "Editing" tab in "Preferences" in a new browser tab for efficency.
• Choose all 3 "Edit area font style" options, reload the editor with each option, check the "font-" CSS rules in DevTools.
• For each option, enable "Syntax highlighting" in the hamburger menu (forces monospace font). (N/A on PatchDemo)
• Evaluate whether the font size is visually perceived as similar with syntax highlighting enabled and disabled (subjective measure). (N/A on PatchDemo)
• With highlighting enabled check the "font-" CSS rules in DevTools (only necessary once). (N/A on PatchDemo)

Summary: This patch addresses all the specific use-cases.

Change 645457 had a related patch set uploaded (by Isarra; owner: Isarra):
[mediawiki/skins/Timeless@master] Fix some annoying things

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

Change 645457 merged by jenkins-bot:
[mediawiki/skins/Timeless@master] Fix some annoying things

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

Change 578568 abandoned by Isarra:
[mediawiki/skins/Timeless@master] Make 2017 wikitext editor use fonts consistent with rest of content

Reason:

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

Change 1005178 had a related patch set uploaded (by MusikAnimal; author: MusikAnimal):

[mediawiki/skins/Timeless@master] Remove unnecessary CodeMirror skin styles

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

Change 1005178 merged by jenkins-bot:

[mediawiki/skins/Timeless@master] Remove unnecessary CodeMirror skin styles

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