[DUPLICATE;SOLVED] CSS issue with context menu?

One weird thing that started to happen me with the context menu (the one that pops up when left-clicking on files) is that it somehow moved to the bottom of the screen (filling the whole width), as opposed to just appearing beside the cursor. I’m compiling Pydio Cells from scratch on a FreeBSD box, and accessing it on macOS (mostly with Google Chrome but also with Safari and Firefox, all of which exhibit the same symptoms).
Here is what I got (names/server names purposely deleted):


The corresponding HTML code for that is on this gist.
Now, what I’ve expected to see was something similar to what Pydio 8 shows:

This is generated by what I’ve placed on this other gist.
Nevermind the size of the menus (which is obviously different), what I would expect is similar styling on both platforms. And, as far as I can see, the CSS for this pop-up menu is exactly the same (.menu-positioner in [...]/gui.ajax/res/build/pydio.material.min.css), i.e.:

.context-menu .menu-positioner {
	position:absolute;
}

.context-menu .menu-positioner .mui-menu {
	position:absolute;
	top:0;
	width:250px!important;
	z-index:2000;
}

.context-menu .menu-positioner .mui-menu .mui-subheader {
	height:0!important;
}

So the only other explanation would be a missing <div> or <span> somewhere on the page; but, once again, I cannot find anything missing when using the W3C validator. All I get for the Cells version (but not for Pydio 8) are these errors:

Error: Duplicate ID Shape.

From line 27, column 5; to line 27, column 234

path>↩ </path

Warning: The first occurrence of ID Shape was here.

From line 26, column 5; to line 26, column 472

ero">↩ </path

Error: Duplicate ID Shape.

From line 28, column 5; to line 28, column 626

path>↩ </path

Warning: The first occurrence of ID Shape was here.

From line 26, column 5; to line 26, column 472

ero">↩ </path

Error: Duplicate ID Shape.

From line 29, column 5; to line 29, column 445

path>↩ </path

Warning: The first occurrence of ID Shape was here.

From line 26, column 5; to line 26, column 472

ero">↩ </path

Error: Duplicate ID Shape.

From line 30, column 5; to line 30, column 551

path>↩ </path

Warning: The first occurrence of ID Shape was here.

From line 26, column 5; to line 26, column 472

ero">↩ </path

And, indeed, there are a few SVGs generated under Pydio Cells (but not under Pydio 8), all of them with the same id (I have no clue if that’s allowed or not), but using this SVG Path Test tool it’s clear that these are rendered as the Pydio Cells logo, and that the rendering correctly produces the desired image (no matter if the id is the same or not).

Again, this might be a very obvious thing (like a checkbox I’ve unchecked by mistake) or something resulting from a complex interplay of configurations and therefore pretty much impossible to fix (at least, just from my description). Also, note that this happens to all users on that particular Cells installation.

Edit: This is a duplicate of Folder/file context menu shows up at bottom of page (dev HEAD) - #9 by falk.john which I had completely missed when searching for similar issues…

This apaers to be caused by the Mobile plugin (gui.mobile) - your browser is, for some reason, detected as as running on a mobile devivce. I faced the same issue and after disabling the plugin the context menu appears as expected.

1 Like

Oh wow — you’re ABSOLUTELY RIGHT! :heart_eyes::smiling_face_with_three_hearts:

So simple to fix!.. Thank you so very much!

Whoops I just saw that this issue had long ago been reported… Folder/file context menu shows up at bottom of page (dev HEAD) My bad!

Looking slightly deeper into the code, it seems that what the gui.mobile plugin does is to parse the User-Agent headers and, if it recognises the headers as coming from a ‘mobile’ device, the viewport is adjusted accordingly. Now the bulk of the code appears to be under github.com/pydio/cells/frontend/front-srv/assets/gui.mobile/res/build where I already noticed that one of the included libraries in mobile-build.js, namely UAParser.js, is slightly out of date (about half a year, in fact). Maybe the fact that I’m running a beta version of macOS Mojave makes all browsers send an unexpected UA header which ‘confuses’ the UA detection in some unpredictable way. Possibly an upgrade of UAParser.js might fix the problem…