Giter Site home page Giter Site logo

Comments (5)

bhaibel avatar bhaibel commented on August 10, 2024 1

The a11y point is a really good one.

I still think we should port the old rails-ujs behavior in, at least for now (maybe it gets a deprecation warning slapped on it?) -- my instinct is that data-method links suddenly Stopping Working is going to be a point of confusion & frustration for folks trying to transition from UJS to Turbo.

From a developer UX perspective, my long-term ideal might be something that warns the developer they are doing a stupid a11y thing, but that might not be worth the extra kb over the wire.

from turbo-rails.

dhh avatar dhh commented on August 10, 2024

I thought we had already pulled this in from UJS, but guess not. @sstephenson thoughts on how to get this in?

Although an alternative would be to say that turning ahrefs into POSTs is a bit of an anti-pattern, especially for a11y reasons. Better to use button_to with a styling. I think that's why this didn't come up in HEY, since we've been removing links that mutate in part for a11y reasons.

But if that approach is followed, we clearly need to document it.

from turbo-rails.

dhh avatar dhh commented on August 10, 2024

@seanpdoyle Any thoughts on the a11y aspect?

from turbo-rails.

seanpdoyle avatar seanpdoyle commented on August 10, 2024

I agree, combining link_to and destructive HTTP Verbs is troublesome. From my perspective, the underlying mismatch between the semantics of a destructive action like an HTTP DELETE and an <a> element complicate the matter.

While the accessibility issues can be papered-over by declaring role="link", it might still surprise users of assistive tech if clicking a link triggered anything but idempotent behavior.

From a developer UX perspective, my long-term ideal might be something that warns the developer they are doing a stupid a11y thing, but that might not be worth the extra kb over the wire.

I've opened rails/rails#40935 against rails/rails, and consider it a temporary bridge toward a long-term improvement. It doesn't warn the developer directly, but it tries to remedy the underlying issue. It shifts the HTTP verb work-around from JavaScript (either RailsUJS or a Turbo polyfill of RailsUJS which may or may not be present or enabled) to the server side via the tried-and-true _method=VERB hidden input element.

I still think we should port the old rails-ujs behavior in, at least for now (maybe it gets a deprecation warning slapped on it?) -- my instinct is that data-method links suddenly Stopping Working is going to be a point of confusion & frustration for folks trying to transition from UJS to Turbo.

I was reflecting on the same issue. I wonder if there is a bridge/polyfill of sorts that we could provide as part of turbo-rails that would map Turbo events to UJS events. I think there's close overlap between:

  • turbo:before-visit and ajax:before
  • turbo:before-fetch-request and ajax:beforeSend
  • turbo:submit-start and ajax:send
  • turbo:before-fetch-response and ajax:success + ajax:error + ajax:complete (depending on the HTTP status in the response)

There isn't a total overlap, but I wonder if there is enough to provide our own Form Submission lifecycle listeners (plus 2 others), while still re-using the majority of Rails.start(). I know that Turbo.start() is invoked during the import call, but maybe we can supplement applications with another module they can import and start as a polyfill of sorts.

I've opened hotwired/turbo#40 to test this out. Its focus was mostly on [data-disable-with], but would complement the changes proposed in rails/rails#40935.

from turbo-rails.

dhh avatar dhh commented on August 10, 2024

Documented the UJS compatibility and stopped removing it from a Webpack app by default.

from turbo-rails.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.