Talk:VisualEditor

Jump to navigation Jump to search

About this board

Previous discussion was archived at Talk:VisualEditor/Archive 1 on 2015-09-01.

AhmadF.Cheema (talkcontribs)

The keyboard shortcut for editing a page through the VisualEditor is Alt+ Shift+V. The same key combination happens to be used for the Show changes button in WikiEditor. Therefore, while in source editing mode, pressing this shortcut causes the switch to Visual editing instead of showing changes in Source editing.

This couldn't have been by design, could it?

Whatamidoing (WMF) (talkcontribs)

I can't reproduce this on my Mac in Safari (the equivalent keyboard shortcut does nothing). Can you tell me your web browser and computer operating system? Also, does it matter whether the cursor is inside the editing box (rather than outside of it, e.g., in the search box)?

AhmadF.Cheema (talkcontribs)

Windows10 1903, Chrome v79.0.3945.130 (64-bit). Placement of cursor makes no difference, checked at all locations (header, footer, sidebar, preview area etc.).

On Firefox v72.0.1 - there, the keyboard shortcut toggles focus between the two Show changes and Visual editing buttons, probably the same as Safari.

On Microsoft Edge - Usually the Visual editing button is given preference, unless the cursor is specifically on the two: "Pages transcluded onto the current version..." and "This page is a member of ... hidden category..." lines, then the Show changes button is activated.

On Chromium-based Edge beta v80.0.361.33 - the same thing happens as in Chrome.

Reply to "Conflicting keyboard shortcuts"

Force Line Breaks in VE

3
Summary by Whatamidoing (WMF)
Konjurer (talkcontribs)

Is there a way to force line breaks in the VE? The editor does not place any space after a bulleted list and it does not look very good.

ESanders (WMF) (talkcontribs)

No, empty linebreaks will be removed by Parsoid no matter where they are in the document. Line spacing should be the responsibility of the skin's CSS, not the user.

Whatamidoing (WMF) (talkcontribs)

Parsoid is no longer removing line breaks.

Reply to "Force Line Breaks in VE"
BrandonXLF (talkcontribs)

Is there a way to get the current wikitext being shown in the editor using JavaScript?

Whatamidoing (WMF) (talkcontribs)

Why do you want to do that? I'm pretty sure that there's a much easier way to accomplish your goal.

BrandonXLF (talkcontribs)

For a user script that will run some regex replacements on the code in the editor.

ESanders (WMF) (talkcontribs)

I assume you are talking about 2017WTE, in which case the surface is in fact compatible with the textSelection API, so

$( '#wpTextbox1' ).textSelection( 'getContents' )

would work. You can use the same API to replace the contents with setContents.

Note this isn't the most efficient API as the whole document will be replaced. If you want to do more targeted replacements you can use the document's findText method. Here's an example script that fixes date formats:

var target = ve.init.target,
	surface = target.surface.model,
	// non-global regex for returning matches
	pattern = new RegExp( '([0-9]{1,2})/([0-9]{1,2})(?:/([0-9]{1,4}))?' );

target.initialEditSummary = 'Fix date formats.';

surface.documentModel.findText( new RegExp( pattern.source, 'g' ), { noOverlaps: true } ).map( function ( range ) {
	// Build all fragments before modifying
	return surface.getLinearFragment( range );
} ).forEach( function ( fragment ) {
	var matches = fragment.getText().match( pattern ),
		year = matches[ 3 ] ? +matches[ 3 ] : new Date().getFullYear();
	if ( year < 100 ) {
		year += 2000;
	}
	// Sanity check that numbers are in range. Avoids matching things like 24/7.
	if ( +matches[ 1 ] > 12 || +matches[ 2 ] > 31 ) {
		return;
	}
	fragment.insertContent( year + '-' + matches[ 1 ].padStart( 2, '0' ) + '-' + matches[ 2 ].padStart( 2, '0' ), true );
} );
Whatamidoing (WMF) (talkcontribs)

Is this complicated enough that you really need to use a script? VisualEditor (visual and wikitext modes) has a built-in find/replace module that handles regex.

BrandonXLF (talkcontribs)

I'm sure there's a better way to do it, but with the regex I'm using, I have to split the text into arrays and run several different regex rules on the text.

Reply to "Get wikitext using JavaScript"
MavropaliasG (talkcontribs)

This page says that real-time collaboration is a feature that is worked upon 'right now' for visual editor. My question is, has work started on real-time collaboration (e.g. google docs style) at all? If yes when will be able to see a first experimental version? In months or years?

At least for the standalone visual-editor, not the one in wikipedia


I have actually found this video which shows this feature implemented through togetherJS.


Thanks

ESanders (WMF) (talkcontribs)

Hi, the page you found is from early 2017. Since then we have done a lot of the backend work to make real-time collaboration possible, and we even have some experimental code that MW users can install, see VisualEditor/Real-time collaboration. Unfortunately this feature is not in the team's priorities for the next year, so we can't make any commitments on when it might be ready, however if you watch the Real-time collaboration page, any updates will be posted there.

MavropaliasG (talkcontribs)

@ESanders (WMF) I did some reading on this task, and I saw you gave some presentations in 2017 and 2018, whose slides I read. You have some great questions inside, also outlined in this abstract. I am very curious if there are any good answers to those questions or not. Unfortunately the notetaker for the 2018 session did not provide any points from the discussion, Would it be possible, whenever you have time, to either put those questions on the task page, or to a page so that proposals to those problems are collaboratively solved? Thank you

ESanders (WMF) (talkcontribs)

Those panels will have been run by @Cscott though I doubt he has the old missing notes.

MavropaliasG (talkcontribs)

Thank you for replying. Is there a page that those questions are available for people to brainstorm on? I feel like having those up on a page (adjunct to the real-time collaboration page?) would allow people to find a solution, much more effectively than a 15-min hurried discussion in a conference. So please, if possible, add those questions somewhere prominent.

Moreover, another way to answering those questions, would be to just fix the bugs for the real time collaboration functionality (at least in the future) and allow third-party installations of mediawiki to use them and through trial and error find the best way (through their feedback) for this to work.

MavropaliasG (talkcontribs)

Thank you so much

Reply to "Real-time collaboration progress?"
Waanders (talkcontribs)

I note that a cookie is being set by the Visual Editor. Name is "VEE", value is "visualeditor". Why is this? I ask this in connection with the GDPR.

Regards, Jethro

Ammarpad (talkcontribs)

The cookie is set to remember the last editor you used, so as to not give you different editor and annoy you.

Marlonke (talkcontribs)

I've followed the instructions as posted on VisualEditor/Skin requirement both the current version and the ones in the history tab. After adding the three div's with their IDs to my skin, the problem persists; nothing happens when I either call the page with the ?veaction=edit parameter, or when I create a button doing essentially the same. The only clue I have is the class 've-not-available' being added to the page after it's loaded.


The VisualEditor works fine on the stock skins I have: Vector and Chameleon.


I'm using the following versions:

VisualEditor 0.1.0 (9da5996) 16 aug 2016 15:40

MediaWiki 1.27.1 (a52d35d)


My HTML structure looks as followed (note the added mw-content-text and content divs)


<div class="grid-x  grid-margin-x">

               <div id="content">

                   <div class="cell">

                       <div  class="contentbody" >

                           <div id="mw-content-text">

                           <?php

                           if( !$this->atHome) {

                               // do not display the HTML tag if the header is empty

                                   if ( $this->skinData->data['title'] != '' ) {

                                       echo '<h1 id="emmskin-pageheader" class="page-title">';

                                       $this->skinData->html( 'title' );

                                       echo '</h1>';

                                   }

                               }

                               //output the post-processed bodytext

                               echo $this->bodyTextHTML;

                           ?>

                           </div>

                       </div>

                   </div>

               </div>

           </div>


I've tried the following:

- Followed the instructions from the history pages of the Skin Requirements page, in which different names are used for the required divs

- Looking in the support section for someone with a similar problem

- Using the Vector/Chameleon skin HTML structure as inspiration, and trying to make everything in my skin look as close as possible.


I'm guessing this issue has something to do with either faulty configuration, or something lacking in my skin. I've found no clear way of debugging this so everything else I tried is largely trial-and-error to no avail.

Marlonke (talkcontribs)

It was indeed faulty configuration. Through debugging (breaklining some of the VE scripts) I managed to find out that the custom skin wasn't seen by VE as a 'supported skin'. I remedied this by adding '$wgVisualEditorSupportedSkins ['mySkin'];' to LocalSettings.php

2605:8D80:6A0:B9C:F14D:6ACA:754A:68CB (talkcontribs)

Also versions match between VisualEditor release and MediaWiki is very crucial. It would be nicer if more error messages would be displayed in case of failure to load.

Reply to "VE doesn't load on custom skin"
Ciencia Al Poder (talkcontribs)

I have Visual Editor and for some reason it generates "dirty diffs" when saving pages on unrelated changes. For example, a user may edit only a single paragraph, but VE removes all "non-significant" white space from tables, headings and lists, in all the page that hasn't been touched.

See this diff as an example.

I though the problem was that I didn't update Parsoid since the last MediaWiki upgrade, but that's not true, because I'm using the latest version available on Debian: 0.10.0all

Whatamidoing (WMF) (talkcontribs)

Weird. Can you reproduce this on a smaller, simpler page? (The point is to see that it happens on a page that you know doesn't contain any unusual wikitext or HTML.)

Ciencia Al Poder (talkcontribs)

Yes, try this test page. You can change something on the first paragraph and see the resulting diff on preview

Just to give more information, I also have RESTBase installed

Whatamidoing (WMF) (talkcontribs)

Special:Version says that your version is a couple of months older than the most recent... but I'm not sure that's the problem. I think that if there had been whitespace changes like that across all the wikis, that someone would have been complaining.

@Cscott, do you have any thoughts about what to check?

Cscott (talkcontribs)

It sounds like "selective serialization" isn't enabled, which is the feature which specifically prevents dirty diffs. I think RESTBase is required to enable selective serialization, so that may be the first thing to check.

Ciencia Al Poder (talkcontribs)

I have RESTBase installed. Is there anything I can do to debug if selective serialization is not working or failing? logs? network traffic between RESTBase and Parsoid?

Ciencia Al Poder (talkcontribs)

I only had to uncomment this line from config.yaml:

       # Use selective serialization (default false)
       useSelser: true

Too bad nobody here was able to suggest such a simple change (and zero documentation about it!) </rant>

Copy and Paste a Table from Microsoft Excel

5
Marc-André Aßbrock (talkcontribs)

I tried to copy and paste a table from LibreOffice Calc into the VisualEditor and I was very happy that it works.

However, I can't copy tables from Microsoft Excel into the VisualEditor. I tried it on our own installation, as well as on de.wikipedia.org. The result was the following: The text of all the cells was written in one line. The columns were separated by two spaces, the lines by four spaces.

While searching on the internet I got the impression, that other people successfully copied from Excel to the VisualEditor.

My questions are: Does it in principle work? And if it works in principle: What is the trick to make it work?

Thanks in advance for any answer.

Whatamidoing (WMF) (talkcontribs)

Hmm. It works in principle, but whether any given spreadsheet/any given version works... I don't know. Were you able to test a very small table (just a few cells, with no fancy formatting)?

In the meantime, have you considered exporting it as a .csv file? You can drag-and-drop .csv files into the visual editor, and it will convert them to tables for you.

ESanders (WMF) (talkcontribs)

We use HTML to paste from spreadsheets. To see what HTML Excel is producing, you can paste into the right side of this: https://edg2s.github.io/content-editable-sandbox/ which will help us investigate. You can also do the paste with the developer console open (F12) and see if there are any errors listed.

50.74.80.182 (talkcontribs)
Reply to "Copy and Paste a Table from Microsoft Excel"

middle-click-paste in VisualEditor on Chrome/ium not working

2
Summary by 197.235.242.46
CrankyAlias (talkcontribs)

Under Linux desktops it is normal to mark any text with the mouse and then insert it anywhere with the center button (wheel) of the mouse.

If you now have the VisualEditor open in Chrome or Chromium and want to insert marked text with the "middle-click-paste" function, the cloud symbol will always appear instead of the text: ☁

Normal copy / paste works as desired.


Under Firefox the problem is not present.


Btw. the problem is also present in THIS editor. ;)


System: Debian buster

Mediawiki: 1.33

VisualEditor: 8c9c37e

ESanders (WMF) (talkcontribs)

This working fine for me on this site, is this just an issue in 1.33?

Reply to "middle-click-paste in VisualEditor on Chrome/ium not working"

Visual Editor Toolbar is overlaps the TemplateData Dialog

2
50.82.132.227 (talkcontribs)

Anyone have any clue why the toolbar would be overlapping on top of the TemplateData dialog?

Whatamidoing (WMF) (talkcontribs)

On what page?

Reply to "Visual Editor Toolbar is overlaps the TemplateData Dialog"