Change Details

Graphs using the <graph>-extension only show empty background in mobile view (both in Minerva and Vector). This seems to be limited to the article namespace, they do show in sandboxes and template pages. This is seen in at least svwp, enwp and dewp. An example from the svwp article [[ https://sv.m.wikipedia.org/wiki/Nordbalt | Nordbalt ]] in mobile view shows <img width="0" height="0" ...: ``` <div class="mw-graph" style="min-width:600px;min-height:400px"><noscript>&lt;img class="mw-graph-img" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"&gt;</noscript><img width="0" height="0" class="mw-graph-img image-lazy-loaded" alt="" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png" srcset=""></div> ``` The width and height properties should be copied to the image. Either that fails or they are replaced by "0".

Graphs using the <graph>-extension only show empty background in mobile view (both in Minerva and Vector). This seems to be limited to the article namespace, they do show in sandboxes and template pages. This is seen in at least svwp, enwp and dewp. An example from the svwp article [[ https://sv.m.wikipedia.org/wiki/Nordbalt | Nordbalt ]] in mobile view shows <img width="0" height="0" ...: ``` <div class="mw-graph" style="min-width:600px;min-height:400px"><noscript>&lt;img class="mw-graph-img" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"&gt;</noscript><img width="0" height="0" class="mw-graph-img image-lazy-loaded" alt="" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png" srcset=""></div> ``` The width and height properties should be copied to the image. Either that fails or they are replaced by "0". = Acceptance criteria [] An explicit width needs to be added on the graph img tag. e.g``` <div class="mw-graph" style="min-width:600px;min-height:400px"><img class="mw-graph-img" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"></div> ``` becomes ``` <div class="mw-graph" style="min-width:600px;min-height:400px"><img class="mw-graph-img" width=600 height=400 src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"></div> ``` = Developer notes The img tag does not define width or height attributes These are important to avoid reflows and to add compatibility with MobileFrontend's lazy image loading.

Graphs using the <graph>-extension only show empty background in mobile view (both in Minerva and Vector). This seems to be limited to the article namespace, they do show in sandboxes and template pages. This is seen in at least svwp, enwp and dewp. An example from the svwp article [[ https://sv.m.wikipedia.org/wiki/Nordbalt | Nordbalt ]] in mobile view shows <img width="0" height="0" ...: ``` <div class="mw-graph" style="min-width:600px;min-height:400px"><noscript>&lt;img class="mw-graph-img" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"&gt;</noscript><img width="0" height="0" class="mw-graph-img image-lazy-loaded" alt="" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png" srcset=""></div> ``` The width and height properties should be copied to the image. Either that fails or they are replaced by "0". = Acceptance criteria [] An explicit width needs to be added on the graph img tag. e.g``` <div class="mw-graph" style="min-width:600px;min-height:400px"><img class="mw-graph-img" src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"></div> ``` becomes ``` <div class="mw-graph" style="min-width:600px;min-height:400px"><img class="mw-graph-img" width=600 height=400 src="/api/rest_v1/page/graph/png/Nordbalt/0/cadd362816f69c5f3d109bc9fe9a43a7120b0061.png"></div> ``` = Developer notes The img tag does not define width or height attributes These are important to avoid reflows and to add compatibility with MobileFrontend's lazy image loading.