Page MenuHomePhabricator

[S] Components must not add all (API) result keys as HTML element properties
Closed, ResolvedPublic

Description

Some nodes currently looks like this:

<a href="https://commons.wikimedia.org/wiki/File:1-month-old_kittens_32.jpg" title="File:1-month-old kittens 32.jpg" target="_blank" class="wbmi-image-result" ns="6" contentmodel="wikitext" pagelanguage="en" pagelanguagehtmlcode="en" pagelanguagedir="ltr" touched="2020-08-28T13:45:27Z" lastrevid="438382314" length="500" fullurl="https://commons.wikimedia.org/wiki/File:1-month-old_kittens_32.jpg" editurl="https://commons.wikimedia.org/w/index.php?title=File:1-month-old_kittens_32.jpg&amp;action=edit" imagerepository="local" style="width: 270px; height: 180px;">

Most of those properties are not needed but are just additional, unwanted, data from the search API response.
The properties should not be added to the node because changes later on (or even from another extension) to the API output could result in actual HTML properties messing up the output or create invalid HTML (e.g. the API result including a property 'id' containing the numeric article id would not be unthinkable)

Event Timeline

This is because we are using the v-bind directive without arguments in a few places, binding an entire API response object to a given element on the page. This was convenient in the beginning because we weren't always 100% sure what properties from the object we might need as we were adjusting the initial designs, etc. But I can see how it could be confusing or problematic.

In cases where we still need to pass down a large number of properties to a child component but don't want *everything* from a given object to show up, we should probably create a new computed property in the parent that returns an object containing only the properties we need.

CBogen renamed this task from Components must not add all (API) result keys as HTML element properties to [S] Components must not add all (API) result keys as HTML element properties.Sep 23 2020, 4:19 PM

Change 629462 had a related patch set uploaded (by Eric Gardner; owner: Eric Gardner):
[mediawiki/extensions/WikibaseMediaInfo@master] Set inheritAttrs to false where v-bind is used without arguments

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

Change 629462 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Set inheritAttrs to false where v-bind is used without arguments

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

Etonkovidova subscribed.

Checked in commons wmf.13, e.g. of a href

<a href="https://commons.wikimedia.org/wiki/File:Bird_in_Swayambhunath.jpg" title="File:Bird in Swayambhunath.jpg" target="_blank" class="wbmi-image-result" style="width: 240px; height: 180px;">