Page MenuHomePhabricator

Allow Phonos parser tag to accept wikitext in the label
Closed, ResolvedPublic3 Estimated Story Points

Description

Background

Some templates like Template:IPAc-en build special markup for the IPA that is shown. In this case, it allows you to hover over each individual character in the IPA to see an example of how to pronounce it (see Hasil Adkins for example usage). Currently, Phonos only lets you pass in the raw IPA string, which we then turn into HTML. Thus, we can't currently support what Template:IPAc-en does.

Acceptance criteria

  • Make sure that the parser tag accepts wikitext, e.g. <phonos>Lorem ''ipsum'', {{IPAc-en|sic amet}}</phonos>
  • The PhonosButton class should then make use of the custom label, showing it next to the play icon instead of the IPA or whatever Phonos would normally show.
  • Together with the play icon should already have the .ext-phonos-PhonosButton class and thus should work as expected (clicking plays the audio)

Event Timeline

Rather than HTML, should this accept wikitext and call $parser->recursivePreprocess()? Then whatever templates etc. can be passed in, e.g.

{{#phonos: lang=en |ipa='hæsəl |label=Lorem {{IPAc-en|'|h|æ|s|əl|}} ipsum |text=Hasil }}

I've used |label= here because it seems a generic "use this for display" might be good. Could also be provided empty to suppress any label being shown, which I think we talked about for some other use case (i.e. just show a speaker icon).

MusikAnimal renamed this task from Allow Phonos parser function to accept custom HTML to Allow Phonos parser function to accept a custom label.Aug 12 2022, 6:14 PM
MusikAnimal updated the task description. (Show Details)

Ah yes that makes a lot more sense, and avoids the possibly security issue. I didn't even think about passing in the template itself! That will make for an easier rollout too. I've updated the task description.

Change 827586 had a related patch set uploaded (by MusikAnimal; author: MusikAnimal):

[mediawiki/extensions/Phonos@master] Allow Phonos parser function to accept a custom label

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

Change 827586 merged by jenkins-bot:

[mediawiki/extensions/Phonos@master] Allow Phonos parser function to accept a custom label

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

@MusikAnimal I used {{#phonos: lang=en |ipa='hæsəl |label={{IPAc-en|'|h|æ|s|əl|}} |text=Hasil }} but on the article it looks like:

custom_label.png (178×1 px, 21 KB)

(I checked that using the template {{IPAc-en|'|h|æ|s|əl|}} on its own works fine.)

Testing notes

This change should allow us to support the functionality explained in T309613#8136935.

For example:

  1. Save this wikitext to any article: {{#phonos:lang=en|ipa=kənˈtʌki|label={{IPAc-en|k|ə|n|ˈ|t|ʌ|k|i}}|text=Kentucky}}
  2. The behaviour when you hover over it should be the same as in https://en.wikipedia.org/wiki/Kentucky (see the screenshot in T309613#8136935)

If you are testing this locally (using Docker), you need to "import" the {{IPAc-en}} template. You can do this by:

  1. Adding this to your LocalSettings.php: $wgImportSources = ['wikipedia'];
  2. Go to http://localhost:8080/wiki/Special:ApiSandbox#action=import&format=json&interwikisource=wikipedia&interwikipage=Template%3AIPAc-en&templates=1
  3. Click "Make request" (if you see a popup after doing this, click "Correct token and resubmit" in the popup)

@MusikAnimal The behaviour is different now (I assume due to T317112#8217850).

<phonos lang="en" ipa="'hæsəl" text="Hasil">{{IPAc-en|'|h|æ|s|əl|}}</phonos>

custom_label_new_syntax.png (57×277 px, 1 KB)

You can also see it on https://patchdemo.wmflabs.org/wikis/51183b9788/wiki/Main_Page.

Further to the above, moving back to In Development as it might need more work.

Going to unlick as I'm busy with other tasks right now.

At quick glance though, it does look like the wikitext parsing broke at some point. We should add a parser test that puts simple wikitext in the phonos tags, i.e.:

<phonos ipa="həˈləʊ">'''hello'''</phonos>

and the test case makes sure the "hello" text has a <b> tag around it.

Change 839945 had a related patch set uploaded (by Samwilson; author: Samwilson):

[mediawiki/extensions/Phonos@master] Parse label string before passing to the button

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

Samwilson renamed this task from Allow Phonos parser function to accept a custom label to Allow Phonos parser function to accept wikitext in the label.Oct 7 2022, 5:49 AM
Samwilson claimed this task.
Samwilson updated the task description. (Show Details)

I've updated the description here to reflect the change from a parser function to a tag.

KSiebert renamed this task from Allow Phonos parser function to accept wikitext in the label to Allow Phonos parser tag to accept wikitext in the label.Oct 10 2022, 9:36 AM

Change 839945 merged by jenkins-bot:

[mediawiki/extensions/Phonos@master] Parse label string before passing to the button

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

@MusikAnimal @Samwilson I have tried to include {{IPAc-en}} in the Phonos tag but it does not appear.

For example, the first Phonos tag on this page: https://en.wikipedia.beta.wmflabs.org/wiki/Phonos_Labels

Notice that when you first load the page you do see the template briefly before it disappears.

It works fine without JavaScript, except the <a> link does not cover the IPA text transcluded by the template. Not sure what the desired/expected behaviour is here.

Change 854132 had a related patch set uploaded (by MusikAnimal; author: MusikAnimal):

[mediawiki/extensions/Phonos@master] Phonos: fully parse label content and strip out <p> tag

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

I have tried to include {{IPAc-en}} in the Phonos tag but it does not appear.

For example, the first Phonos tag on this page: https://en.wikipedia.beta.wmflabs.org/wiki/Phonos_Labels

Notice that when you first load the page you do see the template briefly before it disappears.

Good catch! I'm moving this task back to In Development since this is a must-fix issue, at least for larger wikis that have more complex IPA templates. I attempted a fix at https://gerrit.wikimedia.org/r/854132 but I'm not sure it's the best approach.

It works fine without JavaScript, except the <a> link does not cover the IPA text transcluded by the template. Not sure what the desired/expected behaviour is here.

If you mean that the link still plays the audio instead of going to the page the wikitext links to, then that's expected. The label of the Phonos button is supposed to always be a link that plays the audio. If a community wants to link somewhere else, they should adjust their template accordingly, showing just the play icon and putting the other content adjacent to the <phonos> tag.

If you mean that the link still plays the audio instead of going to the page the wikitext links to, then that's expected. The label of the Phonos button is supposed to always be a link that plays the audio. If a community wants to link somewhere else, they should adjust their template accordingly, showing just the play icon and putting the other content adjacent to the <phonos> tag.

No, it is the opposite. It does not play the audio. Instead, it takes you to https://en.wikipedia.beta.wmflabs.org/wiki/Help:IPA/English. You have to click on the speaker icon to play the audio.

No, it is the opposite. It does not play the audio. Instead, it takes you to https://en.wikipedia.beta.wmflabs.org/wiki/Help:IPA/English. You have to click on the speaker icon to play the audio.

Ah, I think that was because you had JavaScript disabled. The JS intercepts the click and prevents whatever it would normally do. Once the bug is fixed, you'll see the behaviour I'm talking about (which again is expected).

Allowing more than plain text as a label is indeed a good idea, but just FYI: we would never put the entire transcription {{IPAc-en}} produces inside a Phonos button, especially given MOS:DIAPHONEMIC. We would simply make it like /ˈlɔːrəm ˈɪpsəm/ [🔈UK] [🔈US], and even for other languages probably just [foo] [🔈listen].

Change 854132 merged by jenkins-bot:

[mediawiki/extensions/Phonos@master] Phonos: fully parse label content and strip out <p> tag

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

Allowing more than plain text as a label is indeed a good idea, but just FYI: we would never put the entire transcription {{IPAc-en}} produces inside a Phonos button, especially given MOS:DIAPHONEMIC. We would simply make it like /ˈlɔːrəm ˈɪpsəm/ [🔈UK] [🔈US], and even for other languages probably just [foo] [🔈listen].

That's good to know, thanks. But yes, it seems best to allow any wikitext within the <phonos> tags (even though that might make it easier to break the display of the button; it'll at least be obvious if something's wrong, I think).

That's good to know, thanks. But yes, it seems best to allow any wikitext within the <phonos> tags (even though that might make it easier to break the display of the button; it'll at least be obvious if something's wrong, I think).

@Samwilson @MusikAnimal I am not sure how robust we want it to be. See examples where some Phonos tags are being eaten by others (to compare, view them without javascript):

I have been generating phonos tags with different wikitext in the label by running this in the tests/parser directory, but I don't know how many we need to test:

perl -0777 -ne 'print "<phonos ipa=\"hələʊ\">$1</phonos>\n\n" while /!! w?i?k?i?text(.*?)!!/gs' *.txt

A note. For accessibility reasons, it is not good to nest buttons (links) within buttons.

Allowing more than plain text as a label is indeed a good idea, but just FYI: we would never put the entire transcription {{IPAc-en}} produces inside a Phonos button, especially given MOS:DIAPHONEMIC. We would simply make it like /ˈlɔːrəm ˈɪpsəm/ [🔈UK] [🔈US], and even for other languages probably just [foo] [🔈listen].

There is no 'we' when it comes to mediawiki editors. If its possible, people will use it like that somewhere in the eco system ;)

Wait, why on earth does the text have dotted underlines?? If it's because {{IPAc-en}} does it, that's telling the reader "you can hover your mouse over here to see more info", mimicking <abbr>!

ETA: T324524: Dotted underlines are confusing

You can now have a template in a phonos label, e.g. <phonos lang="en" ipa="'hæsəl" text="Hasil" lang="en-GB">{{IPAc-en|'|h|æ|s|əl|}}</phonos>.

There are some problems as raised in T315030#8438516, but perhaps they won't matter in reality.