Page MenuHomePhabricator

QA page issues feature
Closed, ResolvedPublic

Assigned To
Authored By
ovasileva
Sep 11 2018, 10:02 PM
Referenced Files
F26610101: Screen_Shot_2018-10-11_at_1.03.24_PM.png
Oct 15 2018, 4:12 PM
F26527926: Screen Shot 2018-10-11 at 1.03.24 PM.png
Oct 12 2018, 6:04 PM
F26527888: Screen Shot 2018-10-11 at 1.00.40 PM.png
Oct 12 2018, 6:04 PM
F26527999: Screen Shot 2018-10-11 at 1.10.16 PM.png
Oct 12 2018, 6:04 PM
F26527819: Screen Shot 2018-10-11 at 12.52.18 PM.png
Oct 12 2018, 6:04 PM
F26281998: Screen Shot 2018-10-02 at 4.35.44 PM.png
Oct 2 2018, 11:38 PM

Description

Background

Prior to deploying the A/B test, we would like to do some exploratory testing on the page issues feature, in addition to confirming that there is no regressions from the previously QA'd tasks

Acceptance criteria

  • Ensure page issues work as expected
  • Perform exploratory testing on page issues feature

Sign off steps

  • Identify and create bugs for all the found issues

Setup

test through a number of pages on https://people.wikimedia.org/~jdrewniak/more_ambox/ :

  • for any template, go to "what links here" and select an article with issues
  • not all pages are updates, so it might take a bit of clicking to get a page with issues

take screenshots and report any bugs found:

  • New treatment: to each url, add ?minerva-issues=b
  • Old treatment: default

Related Objects

Event Timeline

Pulling into sprint, as @ABorbaWMF, @Ryasmeen, @alexhollender, and @ovasileva are starting testing

Examples so far:
Mac OSX 10.13 Safari 11

image.png (768×1 px, 176 KB)

Windows 10 Internet Explorer 11
image.png (768×1 px, 135 KB)

Windows 10 Google Chrome 69
image.png (768×1 px, 174 KB)

Windows 10 Firefox 62
image.png (768×1 px, 162 KB)

https://es.m.wikipedia.org/wiki/Coalici%C3%B3n_de_las_Bombas_de_Racimo?minerva-issues=b
Mac OSX 10.13 Safari 11 - This one might be a bug

image.png (768×1 px, 361 KB)

Windows 10 Microsoft Edge 17 - This one might be a bug
image.png (768×1 px, 268 KB)

Windows 10 Firefox 62 (64-bit)

image.png (768×1 px, 115 KB)

Mac OSX 10.13 Google Chrome 69 (64-bit)
image.png (768×1 px, 167 KB)

Mac OSX 10.13 Safari 11
image.png (768×1 px, 314 KB)

Mac OSX 10.13 Firefox 62
image.png (768×1 px, 293 KB)

Mac OSX 10.13 Safari 11
image.png (768×1 px, 221 KB)

Mac OSX 10.13 Opera 55
image.png (768×1 px, 228 KB)

Mac OSX 10.13 Safari 11 - This may be a bug
Page issues on ?minerva-issues=a do not appear on ?minerva-issues=b
https://en.wikipedia.org/wiki/Cauchy_sequence?minerva-issues=a

Screen Shot 2018-09-27 at 1.57.48 PM.png (754×2 px, 202 KB)
Screen Shot 2018-09-27 at 1.58.23 PM.png (594×2 px, 120 KB)
Screen Shot 2018-09-27 at 1.58.06 PM.png (766×2 px, 228 KB)

Windows 10 Microsoft Edge 17

image.png (768×1 px, 109 KB)

Windows 10 Google Chrome 69 (64-bit)
image.png (768×1 px, 107 KB)

https://ru.m.wikipedia.org/wiki/%D0%9B%D0%B0%D0%B2%D1%80%D0%BE%D0%B2%D1%81%D0%BA%D0%B8%D0%B9,_%D0%9D%D0%B8%D0%BA%D0%BE%D0%BB%D0%B0%D0%B9_%D0%90%D0%BB%D0%B5%D0%BA%D1%81%D0%B5%D0%B5%D0%B2%D0%B8%D1%87?minerva-issues=b

Mac OSX 10.13 Google Chrome 69 (64-bit) - There is some text overlap within the page issue area, upper left side

image.png (768×1 px, 213 KB)

Windows 8.1 Internet Explorer 11 - There is some text overlap within the page issue area, upper left side
image.png (768×1 px, 137 KB)

https://pt.m.wikipedia.org/wiki/Papa_Bento_IX?minerva-issues=b
Windows 10 Microsoft Edge 17 - Page issue does not extend to the right edge.

image.png (768×1 px, 208 KB)

Windows 10 Google Chrome 69 (64-bit)
image.png (768×1 px, 214 KB)

Confirmation for A/B test readiness - Catalan Wikipedia:

single:
https://ca.m.wikipedia.org/wiki/Murci%C3%A0?minerva-issues=b

Screen Shot 2018-09-28 at 3.34.38 PM.png (748×396 px, 106 KB)

miltiple:
https://ca.m.wikipedia.org/wiki/Murci%C3%A0?minerva-issues=b
Screen Shot 2018-09-28 at 3.38.21 PM.png (602×397 px, 88 KB)

  • text overlaps on larger screens
  • multiple issues styled incorrectly

Confirmation for A/B test readiness - Japanese Wikipedia
single issues:
https://ja.m.wikipedia.org/w/index.php?title=%E9%87%91%E5%85%89%E6%95%99&useskin=minerva&minerva-issues=b

Screen Shot 2018-09-28 at 3.41.02 PM.png (580×399 px, 115 KB)

multiple + section issues:
https://ja.m.wikipedia.org/wiki/%E7%AB%B9%E6%9C%AC%E6%B3%89?minerva-issues=b
Screen Shot 2018-09-28 at 3.42.24 PM.png (610×435 px, 127 KB)

multiple issues, uncollapsed
Screen Shot 2018-09-28 at 3.45.11 PM.png (624×450 px, 128 KB)

confirmed modals look as expected
status: ready for testing

languagesingle issuesection issuemultiple issuesminerva desktopnotes
English
en.m.wikipedia.org_wiki_Microscope_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 246 KB)
link
en.m.wikipedia.org_wiki_The_Animatrix_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 174 KB)
link
en.m.wikipedia.org_wiki_The_Myth_of_Sisyphus_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 429 KB)
link
en.wikipedia.org_wiki_Microscope_useskin=minerva&minerva-issues=b.png (799×822 px, 271 KB)
link
...
Spanish
es.m.wikipedia.org_wiki_Ataxia_de_Friedreich_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 166 KB)
link
es.m.wikipedia.org_wiki_Insulina_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 190 KB)
link
es.m.wikipedia.org_wiki_Cruz_Azul_F%C3%BAtbol_Club_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 183 KB)
link
Screen Shot 2018-10-01 at 10.11.25 AM.png (778×771 px, 194 KB)
link
...
German
de.m.wikipedia.org_wiki_Zentralverwaltungswirtschaft_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 198 KB)
link
de.m.wikipedia.org_wiki_Optische_Koh%C3%A4renztomografie_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 202 KB)
link
de.m.wikipedia.org_wiki_Jean-Baptiste_Lully_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 228 KB)
link
Screen Shot 2018-10-01 at 10.31.23 AM.png (714×820 px, 303 KB)
link
...
Japanese
ja.m.wikipedia.org_wiki_%E9%87%91%E5%85%89%E6%95%99_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 421 KB)
link
ja.m.wikipedia.org_wiki_%E8%8F%A9%E8%96%A9_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 223 KB)
link
ja.m.wikipedia.org_wiki_%E5%8C%97%E6%B5%B7%E9%81%93%E6%96%B0%E5%B9%B9%E7%B7%9A_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 326 KB)
link
ja.wikipedia.org_wiki_%E9%87%91%E5%85%89%E6%95%99_useskin=minerva&minerva-issues=b.png (799×822 px, 284 KB)
link
...
French
fr.m.wikipedia.org_wiki_Vezouze_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 272 KB)
link
fr.m.wikipedia.org_wiki_Th%C3%A9orie_de_la_percolation_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 180 KB)
link
fr.m.wikipedia.org_wiki_Break_dance_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 177 KB)
link
fr.wikipedia.org_wiki_M%C3%A9thode_agile_useskin=minerva&minerva-issues=b.png (799×822 px, 191 KB)
link
...
Russian
ru.m.wikipedia.org_wiki_%D0%A0%D0%BE%D1%81%D1%82%D0%BE%D0%B2%D1%89%D0%B8%D1%87%D0%B5%D1%81%D1%82%D0%B2%D0%BE_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 201 KB)
link
ru.m.wikipedia.org_wiki_%D0%A1%D0%BF%D0%B8%D1%81%D0%BE%D0%BA_%D0%B7%D0%B0%D1%81%D0%BB%D1%83%D0%B6%D0%B5%D0%BD%D0%BD%D1%8B%D1%85_%D0%BC%D0%B0%D1%81%D1%82%D0%B5%D1%80%D0%BE%D0%B2_%D1%81%D0%BF%D0%BE%D1%80%D1%82%D0%B0_%D0%A0%D0%BE%D1%81%D1%81%D.png (1×750 px, 208 KB)
link
ru.m.wikipedia.org_wiki_%D0%92%D1%82%D0%BE%D1%80%D0%B0%D1%8F_%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D1%8F_%D0%B2%D0%BE%D0%B9%D0%BD%D0%B0_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 240 KB)
link
ru.wikipedia.org_wiki_%D0%A0%D0%BE%D1%81%D1%82%D0%BE%D0%B2%D1%89%D0%B8%D1%87%D0%B5%D1%81%D1%82%D0%B2%D0%BE_useskin=minerva&minerva-issues=b.png (799×822 px, 175 KB)
link
...
Italian
it.m.wikipedia.org_wiki_80%C2%BA_Centro_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 177 KB)
link
(section issues seem to be hidden in Minerva)
it.m.wikipedia.org_wiki_Cardiocentrismo_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 146 KB)
link
it.wikipedia.org_wiki_80%C2%BA_Centro_useskin=minerva&minerva-issues=b.png (799×822 px, 226 KB)
link
...
Chinese
zh.m.wikipedia.org_wiki_%E8%A2%81%E4%B8%96%E5%87%AF_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 302 KB)
link
zh.m.wikipedia.org_wiki_%E4%B8%AD%E5%8D%8E%E4%BA%BA%E6%B0%91%E5%85%B1%E5%92%8C%E5%9B%BD%E4%BA%BA%E6%9D%83_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 225 KB)
link
zh.m.wikipedia.org_wiki_%E4%B8%AD%E5%8C%BB%E5%AD%A6_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 188 KB)
link
zh.wikipedia.org_wiki_%E8%A2%81%E4%B8%96%E5%87%AF_useskin=minerva&minerva-issues=b.png (799×822 px, 431 KB)
link
...
Portuguese
pt.m.wikipedia.org_wiki_Z%C3%A9lia_Hoffman_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 181 KB)
link
pt.m.wikipedia.org_wiki_Homeopatia(iPhone 6_7_8).png (1×750 px, 207 KB)
link
pt.m.wikipedia.org_wiki_Papel-travesti_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 195 KB)
link
pt.wikipedia.org_wiki_Z%C3%A9lia_Hoffman_useskin=minerva&minerva-issues=b.png (799×822 px, 158 KB)
link
...
Polish
pl.m.wikipedia.org_wiki_Recepta_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 211 KB)
link
pl.m.wikipedia.org_wiki_Szyna_(profil)_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 113 KB)
link
pl.m.wikipedia.org_wiki_Ustawa_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 184 KB)
link
pl.wikipedia.org_wiki_Recepta_useskin=minerva&minerva-issues=b.png (799×822 px, 252 KB)
link
...

https://es.m.wikipedia.org/wiki/Coalici%C3%B3n_de_las_Bombas_de_Racimo?minerva-issues=b
Mac OSX 10.13 Safari 11 - This one might be a bug

image.png (768×1 px, 361 KB)

This one is a template issue, it's also happening on vector:

Screen Shot 2018-10-01 at 11.13.36 AM.png (508×1 px, 386 KB)

Confirmation for A/B test readiness - Russian Wikipedia
Sidenote: looks so good!

Noted severity working as expected
status: ready for testing

Hi, sorry, can you clarify why this ‘looks so good’ in your opinion? Compared with English Wikipedia template, a lot of secondary information is being displayed, is this an intended effect for non-English projects or is testing being done just for non-layout breaking bugs?

Confirmation for A/B test readiness - Russian Wikipedia
Sidenote: looks so good!

Noted severity working as expected
status: ready for testing

Hi, sorry, can you clarify why this ‘looks so good’ in your opinion? Compared with English Wikipedia template, a lot of secondary information is being displayed, is this an intended effect for non-English projects or is testing being done just for non-layout breaking bugs?

Continuing the conversation at T206007: Russian ambox page issues on Minerva showing secondary information but just to document here as well, my comment was referring to the overall look of the page issues rather than the content. Here, the Russian ambox template does not contain the hide-when-compact class and is thus displaying the entire text of the message

Testing: https://ace.m.wikipedia.org
Chrome: Version 69.0.3497.100

Old treatment:

Screen Shot 2018-10-02 at 2.21.55 PM.png (465×1 px, 55 KB)

Text overlap observed on new treatment:

Screen Shot 2018-10-02 at 2.10.41 PM.png (434×1 px, 65 KB)

Screen Shot 2018-10-02 at 2.22.33 PM.png (446×1 px, 61 KB)

Multiple issues, new treatment with text overlapped:

Screen Shot 2018-10-02 at 2.33.13 PM.png (465×1 px, 101 KB)

Testing: https://ast.m.wikipedia.org
?minerva-issues=b
Single issue:

Screen Shot 2018-10-02 at 2.53.43 PM.png (495×1 px, 114 KB)

Testing: https://av.m.wikipedia.org

Single issue:

Screen Shot 2018-10-02 at 3.01.54 PM.png (474×1 px, 100 KB)

Screen Shot 2018-10-02 at 3.53.59 PM.png (586×1 px, 98 KB)

Screen Shot 2018-10-02 at 3.56.00 PM.png (398×1 px, 95 KB)

Testing: https://az.m.wikipedia.org
Text overlap observed

Screen Shot 2018-10-02 at 4.01.58 PM.png (279×1 px, 46 KB)

Screen Shot 2018-10-02 at 4.03.18 PM.png (263×1 px, 43 KB)

Screen Shot 2018-10-02 at 4.04.25 PM.png (296×1 px, 50 KB)

Text overlap with multiple issues
Screen Shot 2018-10-02 at 4.05.36 PM.png (355×1 px, 69 KB)

Testing https://bjn.m.wikipedia.org/wiki/Liverpool_F.C.?minerva-issues=b

Text overlap when multiple issues:

Screen Shot 2018-10-02 at 4.08.54 PM.png (313×1 px, 53 KB)

Looks good when there is a single issue though:

Screen Shot 2018-10-02 at 4.11.11 PM.png (306×1 px, 43 KB)

Testing:https://be.m.wikipedia.org

Screen Shot 2018-10-02 at 4.12.32 PM.png (304×1 px, 61 KB)

Is it acceptable? Page issues banner not extending to the right edge?

Screen Shot 2018-10-02 at 4.14.08 PM.png (644×1 px, 115 KB)

Testing Bengali wikipedia.

Banner with Single and Multiple issues looks perfect!

Screen Shot 2018-10-02 at 4.23.56 PM.png (576×1 px, 123 KB)

Screen Shot 2018-10-02 at 4.25.54 PM.png (270×1 px, 40 KB)

Screen Shot 2018-10-02 at 4.26.41 PM.png (302×1 px, 52 KB)

Screen Shot 2018-10-02 at 4.28.33 PM.png (288×1 px, 62 KB)

Testing on https://bs.m.wikipedia.org/

Is this a bug?

I see the page issues banner but the pages issues overlay looks empty for several articles.

Screen Shot 2018-10-02 at 4.35.09 PM.png (334×1 px, 72 KB)

Screen Shot 2018-10-02 at 4.35.14 PM.png (154×1 px, 25 KB)

Screen Shot 2018-10-02 at 4.35.44 PM.png (317×1 px, 72 KB)

Trying to come up with a rubric to assess these against.

Good:

  • template icon is yielding to new mobile icon
  • page issue text is being truncated
  • there is a modal to be accessed and it is easily accessible via a "Learn more" button

Has issues:
anything that doesn't qualify as Broken or Good belongs here

Broken:

  • there is overlapping or obscured text
  • there is not a clear distinction between the page issue and the article text (I realize this is somewhat subjective, but for example I'd consider German broken for this reason)

*One thing I'm sort've on the fence about: should lack of truncation qualify as "broken" since it can result in the article contents being pushed nearly or entirely out of view? I'm hesitant to say yes, because there could be many cases where lack of truncation doesn't result in this problem (and I have no sense of how often this will happen). Here are a few examples of how it looks when it occurs:

Screen_Shot_2018-10-11_at_1.03.24_PM.png (1×630 px, 193 KB)
ru.m.wikipedia.org_wiki_Вторая_мировая_война_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 240 KB)
de.m.wikipedia.org_wiki_Jean-Baptiste_Lully_useskin=minerva&minerva-issues=b(iPhone 6_7_8).png (1×750 px, 228 KB)
SpanishRussianFrench

Results thus far:

Good
Catalan
Japanese
English
Chinese
Bengali
Malay

Has issues
Russian
Farsi
Italian
Portuguese
Polish
French
Spanish

Broken
German

Broken
German

Just a note that neither our current nor our future treatment affect German wikipedia - perhaps we can reach out to the German community and see if they're interested in adopting some of the more widely-used templates.

All follow-up bugs related to this card have been opened. Resolving. Thanks to everyone who helped with QA here!