Provide an integration of VisualEditor for Page Forms
Open, NormalPublic


Enable VisualEditor within form fields in Page Forms (previously Semantic Forms).

ClemFlip created this task.Apr 3 2016, 9:28 AM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 3 2016, 9:28 AM
Jdforrester-WMF renamed this task from Enable Visual Editor on Semantic forms to Provide an integration of VisualEditor for SemanticForms.Apr 3 2016, 9:59 AM

We have ve.ui.TargetWidget, which is used inside the image dialog.

Yaron_Koren updated the task description. (Show Details)Apr 3 2016, 1:16 PM
Restricted Application added a project: VisualEditor. · View Herald TranscriptApr 3 2016, 1:18 PM
Jdforrester-WMF triaged this task as Low priority.Apr 12 2016, 7:17 PM
Jdforrester-WMF added a project: Epic.
Jdforrester-WMF moved this task from To Triage to Backlog on the VisualEditor board.

I created a little extension for this use case, available here :

We are currently trying it on

@Pyro853 - Wow, that's amazing! I didn't think that this was possible at all, let alone with just a standalone extension. This could really make a big difference for a lot of wikis that use Page Forms.

Is this ready for widespread release, do you think? And how do you feel about putting it on the Wikimedia Git repository? Conversely, what do you think about adding all this code directly into the Page Forms extension? (I'm not sure that that's a good idea, but I wanted to raise the possibility.)

Hi Yaron, thanks for the enthusiastic feedback :)

Before widespread release, I just think we could do few thinks :

  • test it on others wikis (we only test it on wikifab, with the 'chameleon' skin, we should check it on regular skin) I should be OK, but must be tried
  • change the way to enable the VE on fields : currently, it is done with a bad named css class=form-textarea. we could also add config param to activate it by default on all textareas.

About the wikimedia git repository, i am ok with it. I put it on git hub, because i didn't use to code on gerrit repos, and i have never create a new repo on it. So it was easier on github.

About adding it to Page Form, yeah we could do it. But it should be disabled in default config, because of the need to configure VE extension.
This could be better to change the way to enable VE in a specific param other than 'class=**'

Note the Visual Editor is moving a lot right now, this is working on REL1_28. I think it has good chance to work on futur versions, but I can't say for sure. To integrate it in PageForm, we should try it on 1.29. (I did'nt do it, because for wikifab needs, I prefer use stable version of others extensions)
I was thinking to wait 1.29 is out to check it and update it if needed.

@Pyro853 - yes, it should be tested on other wikis and skins, though I too guess that it'll work fine.

Yes, there are different ways to enable VE - actually, the standard one is to add "editor=visualeditor" to the field tag (that's how it's done for WikiEditor). In turn, that parameter could just add that class, of course. It also seems reasonable to just add it to every textarea, if VE is installed... maybe just as a setting, though.

The more I think about it, the more I think this should be added directly to Page Forms. It's not that much code (looks like about 500 lines of JS, plus a little CSS), and it would be a very important feature. Plus, I try to minimize the number of extensions that users need to install.

I don't think it makes sense to wait until 1.29 comes out - I think we should add this in now! :) How do you feel about trying to add this code in to Page Forms directly? It shouldn't be too hard to do, I would think. If you don't want to, I can try to do it.

Actually, I meant to ask about this before - unlike the standard VE interface, this one doesn't let you choose between internal and external links. (It seems to make all links external.) Is that true? And if so, is there any way to fix the problem? Or is it done on purpose?

Internal links are indeed not yet supported, I didn't take time to solve it. I took example of the integration of VE into Flow, and they do not support it yet.

But it should be possible to fix it, taking time to see how it is done in VisualEditor extension.

I add this to my todo list, and will give you informed when i'll had time to work on it.

Great, that's good to know!

@Pyro853 - I don't know if you've been looking into the linking issue, but I just looked at the Flow test page, and the VE interface there does now seem to allow both internal and external links:

Maybe it's just a matter of copying the latest code from Flow?

Yaron_Koren raised the priority of this task from Low to Normal.Mar 9 2017, 12:20 PM

@Pyro853 - has there been any progress on this? Can I help in any way?

Hi @Yaron_Koren
I didn't take time to work on it since my last message, i just find out that I really have to update to mw1.29 to get thoses new features. The external link feature could event works without any changes.
I don't think this will be difficult, but it'll take some time, and I already tried and failed, just because of connection issues during composer update.

Unfortunately, I am currently on other priorities, so this is in stand by for now.
I hope to have time for it within next month.

If you want to tried it on mw1.29, you can do it, and give me your feedback.

It has been a while since anyone added anything to this exchange. We'd be interested in helping this effort out as many of our users are clamoring for an easier approach to editing SMW wikitext sections in Semantic Pages.

Seb35 renamed this task from Provide an integration of VisualEditor for SemanticForms to Provide an integration of VisualEditor for Page Forms.Aug 4 2017, 4:38 PM
Seb35 updated the task description. (Show Details)
Seb35 added a subscriber: Seb35.
Seb35 added a comment.Aug 4 2017, 4:57 PM

I successfully installed VEForPageForm on MediaWiki 1.28 (with a small issue though). I tried with MediaWiki 1.29 + PageForms REL1_29 + VisualEditor REL1_29 and got two blocking issues:

  • the hook "pfHTMLBeforeForm" I used (see the linked issue on GitHub) was renamed "PageForms::HTMLBeforeForm" in PageForms REL1_29 -- I’m not sure it’s the appropriate hook but it does the job,
  • "Error: Unknown dependency: ext.visualEditor.standalone" in the browser console.