There should be a way for icons to be accessible to on-wiki code. Currently, they are only available for extensions and other ResourceLoader modules via the CodexModule php class.
Perhaps add a simple API endpoint to get the icons?
There should be a way for icons to be accessible to on-wiki code. Currently, they are only available for extensions and other ResourceLoader modules via the CodexModule php class.
Perhaps add a simple API endpoint to get the icons?
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Open | None | T313945 [EPIC] Enable gadget and user-script developers to use Vue and Codex | |||
| Resolved | Feature | SD0001 | T311099 Allow on-wiki scripts and gadgets to use Codex icons | ||
| Resolved | SD0001 | T388964 Create https://www.mediawiki.org/wiki/Special:MyLanguage/API:CodexIcons |
I imagine the most feasible thing here would be to update the gadget extension to support community managed icon packs that gadgets and scripts can use. Editors with the appropriate user right could edit MediaWiki:Gadget-icon-definitions to define a icon module name and list icons.
That would work for gadgets, but as a script developer I should be able to load an icon without needing for the community to define a gadget that loads an icon, since defining a gadget means that metadata about the gadget module is added to all page views of all viewers
A script developer could request/use one of those icon packs managed in the definitions file. If any script can arbitrarily load icons, I'd be concerned that this might result in shipping several versions of the same icons when multiple scripts are installed.
I don't think allowing any developer to generate any arbitrary icon pack is a good idea so I think some kind of collaboration on what icon packs make sense would be the best outcome here. We do a similar thing for gadgets that share the same files. Perhaps we could provide some default modules to ease the burden here (perhaps on meta wiki?).
"I don't think allowing any developer to generate any arbitrary icon pack is a good idea" why not? While multiple copies of the same icon might need to be used, depending on how icons are retrieved, if this is impossible then user scripts will lack a way to migrate from OOUI properly. Defining modules that provide icons would result in more metadata for the module registry, for everyone, and is (in my view) one of the drawbacks for the OOUI icon pack system. What is the point for having such a big library of icons in codex if they cannot all be used?
"I don't think allowing any developer to generate any arbitrary icon pack is a good idea" why not?
Each icon pack would be a ResourceLoader module and T225842 has not been implemented so each icon pack would bloat the registry overhead in the startup module and impact performance for everyone.
What is the point for having such a big library of icons in codex if they cannot all be used?
I didn't say it wouldn't be used. I just said we should be careful about how we expose them. OOUI has multiple icon packs. Presumably, worse case we could do the same. I think having an icon capability in the MediaWiki:Gadgets-definition is probably the best case as gadgets would include icons within their own definition.
This was exactly my thought, we should not need to rely on modules to load icons because icon packs would limit the options or the packs would need to include all icons, meaning that too much would be downloaded. This is why I suggested adding an api endpoint instead. Yes, it would be less efficiently cached, but it would avoid the overhead of bloating the startup registry. Gadgets could still load the icons directly, but user scripts would also have a way to do so.
Some thoughts about how script authors might handle this currently; I was just asked about this and found that copying the icon svg into my user script worked as a hack:
https://en.wikipedia.org/wiki/User:JSherman_(WMF)/revertrisk.js
Another hack would be to fetch the images from the toolforge cdn, eg:
const rootComponent = {
template: `
<p>
<cdx-icon v-if="cdxIconInfo" :icon="cdxIconInfo" />
</p>
`,
data: function () {
return { cdxIconInfo: null };
},
methods: {
fetchCdxIconInfo: function () {
// return early if we already have the icon
if ( this.cdxIconInfo ) {
return;
}
fetch( 'https://tools-static.wmflabs.org/cdnjs/ajax/libs/codex-icons/1.0.1/images/info.svg' )
.then( function ( response ) {
return response.text();
} )
.then( function ( iconData ) {
this.cdxIconInfo = iconData;
}.bind( this ) );
}
},
mounted: function () {
this.fetchCdxIconInfo();
}
};This method works okay too, but it seems like it could result in quite a few extra page requests; also I'm not validating what text is coming back from the cdn, which seems like a problem.
Thinking through a non-hacky way: From the script dev ux side, having an api that allowed piping in multiple icon identifiers and sent back a batch of icons would be handy. What if such an api were implemented in the gadgets extension? Maybe wrap that in a utility that populates local storage (or a global, or something) so that multiple gadgets don't re-request the same assets repeatedly?
Change #1108823 had a related patch set uploaded (by SD0001; author: SD0001):
[mediawiki/extensions/Gadgets@master] Allow codex icons to be used in packaged gadgets
For gadgets, the most straightforward solution is to have a way in gadget definitions to specify the icons used, which can be bundled into the gadget module. The above patch does this. This is also very similar to how extensions bundle codex icons.
For user scripts, agree with comments above that an API would be good to have. The other suggestion of onwiki defined "icon packs" is not practical. The level of collaboration between user script developers and site interface admins for such a solution to be useful just doesn't exist. In the patch below, I have added a list module in the Action API. This can be clubbed with other API modules enabling scripts to simultaneously fetch other data such as JSON config pages and messages in a single call to reduce latency and server round trips.
Change #1109112 had a related patch set uploaded (by SD0001; author: SD0001):
[mediawiki/core@master] api: Add query module for retrieving Codex icons
Change #1109112 merged by jenkins-bot:
[mediawiki/core@master] api: Add query module for retrieving Codex icons
Change #1108823 merged by jenkins-bot:
[mediawiki/extensions/Gadgets@master] Allow codex icons to be used in packaged gadgets
Change #1172701 had a related patch set uploaded (by SD0001; author: SD0001):
[mediawiki/core@master] api: codexicons: make names parameter an enum of all available values
Suggested blurb for tech news: To use Codex icons in user scripts, a new API module has been created: [[mw:API:CodexIcons]].
Change #1172701 merged by jenkins-bot:
[mediawiki/core@master] api: codexicons: make names parameter an enum of all available values
@SD0001 Thanks for the draft-wording & link, that's appreciated!
Question: If I understand correctly, this entry is closely related to the entry that @Tacsipacsi drafted for the .vue files in gadgets entry which also mentions Codex icons, but that sentence uses a different link and I think it has a different focus(?). -- How would you both suggest tweaking the wording and links of the existing entry, and/or to separately mention the Codex icons as a separate (or sub) entry?
TLDR: You might want to merge/rewrite the current and proposed drafts, which are:
[I'll temporarily un-mark that entry from translation, so that you can edit freely, and I'll freeze it again tomorrow (in ~22 hours).]
The two sentences are about two distinct features, which share a common goal but have technically not much in common and have different audiences:
Given that the latter is not new, I’m not sure if it needs to be included – although probably yes, it’s better to announce it late than never. Maybe something like this?
Codex icons can also now be specified directly, replacing the API module for use in gadgets. The API module remains available, and it remains the supported way to use Codex icons in user scripts.
The API module is still fairly new and wasn't announced until now since I was waiting for the Gadgets patches to also merge. I would suggest this wording: https://meta.wikimedia.org/w/index.php?title=Tech/News/2025/32&diff=next&oldid=29069267 (turns out I was logged out).
Hi! I'm trying to use Codex icons in a user script but can't get it working. I can query the API ok, but how do I integrate the data I get with the CdxIcon component? Can we have a code example somewhere? Thanks!