[Grid]-Drag and Drop - Not working when application is deployed on a different context than Root context

silvan-lincan commented 2 years ago

Description

In a Drag and Drop enabled Grid, using Grid#setRowsDraggable(true):

if application is deployed under Root context ( http://127.0.0.1:8080 ), then Drag and Drop works both on a Desktop browser and also on a mobile device
if application is deployed under a different context than Root ( http://127.0.0.1:8080/dnd ), then Drag and Drop works on a Desktop browser, but it is not working on a mobile device, and it fails with the following error:

Expected outcome

Drag and Drop among the Grid rows should work both on Desktop and Mobile, not matter if the application is deployed in the Root context or a different one.

Actual outcome

Drag and Drop is not working on a mobile device, when the application is deployed on a different context than Root and if tails with the following error:

Minimal reproducible example

The issue can be reproduced from a Vaadin 14.7.4 starter. Please see archive attached: vaadin14-dnd-mobile.zip

Steps to reproduce

Start the application: mvn jetty:run .
Open the Google Chrome Desktop browser along with the Developer Tools and set the Device to, for example "iPad Pro" (like in the screenshot). It is important to do this step first, in order to simulate a mobile device.
Access the application at: http://127.0.0.1:8080/dnd
You should obtain the error described above.

Environment

Vaadin 14.7.4
Jetty: 9.4.42.v20210604 with web context set to "/dnd" => http://127.0.0.1:8080/dnd
Google Chrome set to simulate an "iPad Pro"

Notes

Please let me know if you need additional info Thank you.

alvarezguille commented 2 years ago

Seems related to this section in flow, transferring to flow repository https://github.com/vaadin/flow/blob/30886fd96c0cfdb8cc7d8546972666528126fddb/flow-dnd/src/main/java/com/vaadin/flow/component/dnd/internal/DndUtil.java#L97-L127

silvan-lincan commented 2 years ago

Hi @alvarezguille

Thank you.

silvan-lincan commented 2 years ago

Hello,

just a proposal, I don't know if this is really Ok, but looks like it solves the issue. I tried this with flow-2.7.4. In com.vaadin.flow.server.ServiceContextUriResolver#resolveVaadinUri I did the following modification: instead of:

return super.resolveVaadinUri(uri, frontendUrl, "/");

I tried with:

        String context = VaadinService.getCurrentRequest().getContextPath();
        if (!"/".equals(context)) {
            context = context.concat("/");
        }
        return super.resolveVaadinUri(uri, frontendUrl, context);

And then everything works as expected, the resulting url is: /dnd/webjars/mobile-drag-drop/2.3.0-rc.1/index.min.js instead of previously: /webjars/mobile-drag-drop/2.3.0-rc.1/index.min.js

Maybe it helps. Thank you.

Artur- commented 1 year ago

Wow, this has been open for some time... It will be fixed by #16477

vaadin / flow