I'm almost positive this is an issue on our end. Whether the mediawiki version is out of date, or we have a var defined in LocalSettings.php that has been deprecated, although from the trace, I can't work that out.

Here's the HTML output from the Parsoid instance, this is one example of a center aligned image:
<figure class="mw-default-size mw-halign-center" typeof="mw:Image" data-parsoid="{&quot;optList&quot;:[{&quot;ck&quot;:&quot;center&quot;,&quot;ak&quot;:&quot;center&quot;}],&quot;dsr&quot;:[7361,7406,2,2]}">
<a href="./File:test.png" data-parsoid="{&quot;a&quot;:{&quot;href&quot;:&quot;./File:test.png&quot;},&quot;sa&quot;:{},&quot;dsr&quot;:[7363,7404,null,null]}">
<img resource="./File:test.png" data-file-width="1168" data-file-height="394" data-file-type="bitmap" height="394" width="1168" data-parsoid="{&quot;a&quot;:{&quot;resource&quot;:&quot;./File:test.png&quot;,&quot;height&quot;:&quot;394&quot;,&quot;width&quot;:&quot;1168&quot;,&quot;src&quot;:null},&quot;sa&quot;:{&quot;resource&quot;:&quot;File:test.png&quot;,&quot;src&quot;:&quot;//mywiki.com/wiki/images/e/e8/test.png&quot;}}">
</a>
</figure>

It's possible you're using a too-new version of Parsoid and that there was a breaking change, but I don't recall anything in this area changing around that time.

Thanks for the response.

Interesting. The parsoid version we're on is: 0.4.1.

That still appears to be the version that is pulled down from: https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid/deploy which is directed to from this page: https://www.mediawiki.org/wiki/Parsoid/Developer_Setup#Installation_from_source_on_Linux_or_Mac_OS_X

I'll see if I can update our Mediawiki version.

It's not just image alignment, it's when you use any image and pass in options via pipes. Weirdly enough VE creates these, I can't imagine a breaking change like that being down to VE/Parsoid/MediaWiki, that's why I suspect it's more of a local thing, but would be interesting for some investigation.

We've upgraded to Mediawiki 1.26, issue is still occurring. I'm slowly disabling all extensions to see which one may be causing the issue.

I've tried to disable all extensions, same issue.

I've pinned it down in the Parsoid code to the differences between this snippet (no pipes in images):

<p data-parsoid='{"dsr":[0,32,0,0]}'>
	<span class="mw-default-size" typeof="mw:Image" data-parsoid='{"optList":[],"dsr":[0,32,null,null]}'>
		<a href="./File:xx.jpg" data-parsoid='{"a":{"href":"./File:xx.jpg"},"sa":{}}'>
			<img resource="./File:xx.jpg" 
			data-file-width="500" 
			data-file-height="332" 
			data-file-type="bitmap" 
			height="332" 
			width="500" 
			data-parsoid='{	"a":{"resource":"./File:xx.jpg","height":"332","width":"500","src":null},
							"sa":{"resource":"Image:xx.jpg","src":"xx.jpg"}}'
			/>
		</a>
	</span>
</p>

To this (pipes in images):

<figure class="mw-default-size mw-halign-center" 
typeof="mw:Image" 
data-parsoid='{"optList":[{"ck":"center","ak":" center"}],"dsr":[0,41,2,2]}'>
	<a href="./File:xx.jpg" data-parsoid='{"a":{"href":"./File:xx.jpg"},"sa":{},"dsr":[2,39,null,null]}'>
		<img resource="./File:xx.jpg" 
		data-file-width="500" 
		data-file-height="332" 
		data-file-type="bitmap" 
		height="332" 
		width="500" 
		data-parsoid='{	"a":{"resource":"./File:xx.jpg","height":"332","width":"500","src":null},
						"sa":{"resource":"Image:xx.jpg ","src":"xx.jpg"}}'
		/>
	</a>
</figure>

This is stopping pages from loading. Only happens when you have pipes when calling an image e.g.
[[File:img.png|center]]

whereas:
[[File:img.png]] works.

I've downgraded my node from 5.2.x to v0.10.29 (as suggested by the parsoid install). I've upgraded my parsoid to 0.5.1.

Still getting

I've fixed this my self by editing the source code of Mediawiki.

Inside of resources/lib/oojs/oojs.jquery.js:256 I added a check to see if origin was null, if so we skip the loop and return r which would be undefined.

It does mean that images don't display in VE, but at least it works on large pages where you have images that have pipes in them.

I also have this problem with MediaWiki 1.27 and VisualEditor REL1_27 on Ubuntu 14.04. I'm using parsoid 0.5.1 and nodejs 6.3.1 from nodesource (I tried 0.10.25 before with the same result).
I have no issues with VisualEditor REL1_27 on another MediaWiki 1.27 install with parsoid 0.4.1 (and nodejs 6.3.1) on ArchLinux.
Is it possible that an extension is causing this issue?
The extensions in the first Wiki with the VisualEditor issue:

AdminLinks
CirrusSearch
Cite
ConfirmEdit
CSS
Echo
Elastica
ExternalData
Gadgets
GraphViz
ImageMap
InputBox
LdapAuthentication
LocalisationUpdate
MobileFrontend
Nuke
ParserFunctions
pchart4mw
PdfExport
PdfHandler
Poem
Renameuser
ReplaceText
RestrictAccessByCategoryAndGroup
SandboxLink
SemanticCompoundQueries
SemanticForms
SemanticFormsInputs
SemanticMediaWiki
SemanticResultFormats
SimpleMathJax
SpamBlacklist
SyntaxHighlight_GeSHi
Thanks
UserFunctions
Variables
VisualEditor
WikiEditor

The extensions in the Wiki without issues:

AdminLinks
LocalisationUpdate
MobileFrontend
NetworkAuth
ParserFunctions
Renameuser
SemanticForms
SemanticMediaWiki
SemanticResultFormats
SyntaxHighlight_GeSHi
VisualEditor
WikiEditor

Maybe it can help you find a solution. We have the same problem. Our Wiki is in french. If i put this in my LocalSettings.php, it work : $wgLanguageCode = "en";

If i put back the wiki in french, it does not work.

Unfortunately, this doesn't make any difference for me. In both wikis (working and non-working), $wgLanguageCode is set to "de". Switching to "en" didn't make any difference.

Hmm, I'm not sure why this would be different for span than figure (inline vs block, that gets induced by adding "centre"), but ...

you'll notice that both of the img tags are missing a src. From the data-parsoid,

data-parsoid='{	"a":{"resource":"./File:xx.jpg","height":"332","width":"500","src":null},
						"sa":{"resource":"Image:xx.jpg ","src":"xx.jpg"}}'

it looks like "xx.jpg" is being sanitized away (here for 0.6.1),
https://github.com/wikimedia/parsoid/blob/932a33ad208b2de6af4830dc32b9e383b3b8f8ba/lib/wt2html/tt/Sanitizer.js#L1058-L1066

sanitizeHref only returns null if there's a protocol and it's invalid,
https://github.com/wikimedia/parsoid/blob/932a33ad208b2de6af4830dc32b9e383b3b8f8ba/lib/wt2html/tt/Sanitizer.js#L644-L662

which doesn't seem to make a lot of sense for "xx.jpg" but above, there's also this example, //mywiki.com/wiki/images/e/e8/test.png, where the protocol would be parsed as //.

So, couple things to check,

1. siteinfo protocols returned from your mediawiki api includes the protocol relative //
2. imageinfo for the images sets the url as protocol relative
3. maybe VE needs to be able to handle images in figures w/o src attributes

@Arlolra thanks for your update, unfortunately I no longer work at the company where I was having the issue so I can't test your suggestion. Hopefully one of the other commenters can. @Novac93 @Maalab

I would love to test the suggestion, but i don't understant what @Arlolra want us to test. Can you be more precise i wat wou want us tu test please?

Thanks!

Can you paste what your wiki returns for
https://en.wikipedia.org/w/api.php?action=query&meta=siteinfo&siprop=protocols

It should list "//"

Thanks for the explanation. I dont have the "//". Here is the result :
{

"batchcomplete": "",
"query": {
    "protocols": [
        "http://",
        "https://",
        "ftp://",
        "file://",
        "mailto:"
    ]
}

}

@Arlolra i have just add the "//" and test VisualEditor again, and i have the same problem.

Thanks!

{

"batchcomplete": "",
"query": {
    "protocols": [
        "http://",
        "https://",
        "ftp://",
        "file://",
        "mailto:",
        "//"
    ]
}

}

Ok, what does an imageinfo request return for one of the failing images?

https://en.wikipedia.org/w/api.php?action=query&titles=File:Albert%20Einstein%20Head.jpg&prop=imageinfo&iiprop=url%7Cmime%7Csize

@Arlolra Here is the imageinfo for a failing image.

Thanks!

{

"batchcomplete": "",
"query": {
    "normalized": [
        {
            "from": "File:Filigranne Confidentiel.JPG",
            "to": "Fichier:Filigranne Confidentiel.JPG"
        }
    ],
    "pages": {
        "2994": {
            "pageid": 2994,
            "ns": 6,
            "title": "Fichier:Filigranne Confidentiel.JPG",
            "imagerepository": "local",
            "imageinfo": [
                {
                    "size": 21166,
                    "width": 778,
                    "height": 757,
                    "url": "http://stiwikilt01/mediawiki/images/f/f6/Filigranne_Confidentiel.JPG",
                    "descriptionurl": "http://stiwikilt01/mediawiki/index.php/Fichier:Filigranne_Confidentiel.JPG",
                    "descriptionshorturl": "http://stiwikilt01/mediawiki/index.php?curid=2994",
                    "mime": "image/jpeg"
                }
            ]
        }
    }
}

}

In T123471#3062405, @Maalab wrote:

@Arlolra i have just add the "//" and test VisualEditor again, and i have the same problem.

Did you restart Parsoid after making that change?

No sorry, have not think to restart the parsoid service.

Then i have restarted the parsoid service and everything is working well now.

Thanks for your help @Arlolra!