Page MenuHomePhabricator

Graphs and Charts issues on Sepia and Dark modes
Closed, ResolvedPublic

Description

Found on 5.7.0 (1247)

Steps:

  1. Load an article with graphs and/or charts (I used PepsiCo and Wikipedia:Graphs and charts)
  2. View the table or graph
  3. Change to Dark or Sepia modes

Expected result:
The colors and objects within the tables or graphs remain visible

Actual Result:
The colors and objects disappear

PepsiCo DefaultDarkSepia
Simulator Screen Shot - iPhone X - 2017-10-26 at 15.00.57.png (2×984 px, 146 KB)
Simulator Screen Shot - iPhone X - 2017-10-26 at 16.28.50.png (2×984 px, 167 KB)
Simulator Screen Shot - iPhone X - 2017-10-26 at 16.28.39.png (2×984 px, 167 KB)

Graphs anc charts Default|Dark|Sepia|

Simulator Screen Shot - iPhone X - 2017-10-26 at 14.46.34.png (2×984 px, 306 KB)
Simulator Screen Shot - iPhone X - 2017-10-26 at 14.47.01.png (2×984 px, 319 KB)
Simulator Screen Shot - iPhone X - 2017-10-26 at 14.46.43.png (2×984 px, 324 KB)

Event Timeline

Unassigning myself and moving this to Blocked or Waiting as @Fjalapeno advised we hold off on implementing the only semi-reliable solution to investigate Parsoid output first and perhaps use that in a new service.

Created a subtask for a spike.

Screenshots of some of the complexity we may have to wrangle in our theming if we're not able to get graphs/charts css classes we can more easily target:
https://github.com/wikimedia/wikimedia-page-library/pull/96#issuecomment-341830324

The issues in the screenshots crop up because our current options for identifying graphs/chart elements to be excluded from theming are too broad and end up mis-identifying other non graph/chart elements too.

Testing on iPhone 7 (iOS 11.0.2) - Wikipedia app 5.8.0 (1264). As the screencaps show below this is still broken, such as that colors in pie charts and brick charts are still not showing in Sepia and Dark modes.

T179127 Brick Chart Light.PNG (1×750 px, 482 KB)
T179127 Brick Chart Sepia.PNG (1×750 px, 484 KB)
T179127 Brick Chart Dark.PNG (1×750 px, 429 KB)
T179127 Pie Chart Light.PNG (1×750 px, 201 KB)
T179127 Pie Chart Sepia.PNG (1×750 px, 422 KB)
T179127 Pie Chart Dark.PNG (1×750 px, 364 KB)

The cases caught by Nicholas are the ones we decided not to fix due to lack of reliable tags.