Add docs about how to get more fine-grained control of event.preventDefault() calls on web #3451

ddfisher · 2024-02-02T20:28:06Z

The example is a bit verbose, unfortunately, but I'm hoping it's relatively clear and it's also quite close to being directly useful.

See #2831 for more context.

…efault() calls on web

daxpedda

Thank you, this is great!

Let me know if you need any help with anything.

src/platform/web.rs

daxpedda · 2024-02-03T10:36:10Z

src/platform/web.rs

+    ///         event_type,
+    ///         prevent_default_listener.as_ref().unchecked_ref(),
+    ///     );
+    ///     prevent_default_listener.forget();


Suggested change

/// prevent_default_listener.forget();

/// prevent_default_listener.into_js_value();

See Closure::into_js_value().

Oh, interesting -- thanks!

This is still missing.

src/platform/web.rs

daxpedda · 2024-02-03T10:39:36Z

src/platform/web.rs

+    /// This example calls `event.preventDefault()` for all relevant events except for ctrl-c,
+    /// ctrl-x, and ctrl-v.


I think we should pick a different example because I consider the whole preventing clipboard interactions a Winit bug.

E.g. ctrl-p for printing? Maybe also hook up beforeprint just to make the example complete.

Switched to ctrl-p.

Hooking up beforeprint would look something like this:

canvas .add_event_listener_with_callback( "beforeprint", &Closure::<dyn Fn()>::new(|| { // This event is now triggered! }) .into_js_value() .unchecked_into(), ) .unwrap();

Co-authored-by: daxpedda <daxpedda@gmail.com>

…ple to printing

ddfisher · 2024-07-18T16:44:03Z

Let me know if this looks good now! Sorry for the slow turnaround here!

daxpedda · 2024-07-18T18:17:59Z

src/platform/web.rs

@@ -80,8 +80,138 @@ pub trait WindowExtWeb {
    /// For example, by default using the mouse wheel would cause the page to scroll, enabling this
    /// would prevent that.
    ///
+    /// Specifically, this will call `event.preventDefault()` for the following event types:


Suggested change

/// Specifically, this will call `event.preventDefault()` for the following event types:

/// # Implementation Notes

///

/// Specifically, this will call `event.preventDefault()` for the following event types:

daxpedda · 2024-07-18T18:20:09Z

src/platform/web.rs

+    /// `touchstart`, `wheel`, `contextmenu`, `pointerdown`, `pointermove` (for chorded button
+    /// interactions only), `keyup`, and `keydown`.


Suggested change

/// `touchstart`, `wheel`, `contextmenu`, `pointerdown`, `pointermove` (for chorded button

/// interactions only), `keyup`, and `keydown`.

/// `touchstart`, `wheel`, `contextmenu`, `pointerdown`, `pointermove` (for

/// [chorded button events only]), `keyup`, and `keydown`.

And link to https://www.w3.org/TR/2019/REC-pointerevents2-20190404/#chorded-button-interactions.

daxpedda · 2024-07-18T18:21:59Z

src/platform/web.rs

Lets link `event.preventDefault()` to https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault as well.

daxpedda · 2024-07-18T18:22:42Z

src/platform/web.rs

+    /// # Example
+    /// This example calls `event.preventDefault()` for all relevant events except for ctrl-p.


Suggested change

/// # Example

/// This example calls `event.preventDefault()` for all relevant events except for ctrl-p.

/// # Example

///

/// This example calls `event.preventDefault()` for all relevant events except for Ctrl-P.

///

daxpedda · 2024-07-18T19:26:31Z

src/platform/web.rs

+    /// # }
+    /// #
+    /// # impl ApplicationHandler for App {
+    /// #     fn resumed(&mut self, event_loop: &ActiveEventLoop) {


This needs to be moved to can_create_surfaces().
The actual issue of course is that documentation tests are not tested on Web, so I went ahead and fixed that in #3799.

Feel free to rebase this PR on #3799 so you can test it yourself as well.

daxpedda · 2024-07-18T19:28:42Z

src/platform/web.rs

+    /// #             window.set_prevent_default(false);
+    /// #             add_prevent_default_listeners(window.canvas().unwrap());


This part is essential to the example, so it should be visible.
I don't think there is anything wrong with showing the whole struct App and impl ApplicationHandler for App.

daxpedda · 2024-07-18T19:29:51Z

src/platform/web.rs

+    /// #             WindowEvent::RedrawRequested => {
+    /// #                 self.window.as_ref().unwrap().request_redraw();
+    /// #             }


This is probably not a recommended setup, especially for Web.
I think we can get away with only handling WindowEvent::CloseRequested.

daxpedda · 2024-07-18T19:31:20Z

src/platform/web.rs

+    ///                 event.prevent_default();
+    ///             });
+    ///
+    ///         let _ = canvas.add_event_listener_with_callback(


We shouldn't ignore the error, just unwrap() here.

daxpedda · 2024-07-18T20:02:29Z

src/platform/web.rs

+    ///         event_type,
+    ///         prevent_default_listener.as_ref().unchecked_ref(),
+    ///     );
+    ///     prevent_default_listener.forget();


This is still missing.

Add docs about how to get more fine-grained control of event.preventD…

85ea54b

…efault() calls on web

ddfisher requested a review from daxpedda as a code owner February 2, 2024 20:28

daxpedda requested changes Feb 3, 2024

View reviewed changes

ddfisher and others added 2 commits April 5, 2024 15:49

Update src/platform/web.rs

c13cd4c

Co-authored-by: daxpedda <daxpedda@gmail.com>

Update src/platform/web.rs

ab8f4a7

Co-authored-by: daxpedda <daxpedda@gmail.com>

madsmtm added S - docs Awareness, docs, examples, etc. DS - web labels Jun 24, 2024

ddfisher and others added 3 commits July 18, 2024 12:34

Update comment to address chorded button interactions and switch exam…

10468d4

…ple to printing

Make example into full example app

1d2a63f

Merge branch 'master' into prevent_default_docs

3f0b098

minor fix

158f7ee

daxpedda requested changes Jul 18, 2024

View reviewed changes

daxpedda mentioned this pull request Jul 18, 2024

web: prevent_default depending on keys #2831

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add docs about how to get more fine-grained control of event.preventDefault() calls on web #3451

Add docs about how to get more fine-grained control of event.preventDefault() calls on web #3451

ddfisher commented Feb 2, 2024

daxpedda left a comment

daxpedda Feb 3, 2024

ddfisher Apr 5, 2024

daxpedda Jul 18, 2024

daxpedda Feb 3, 2024

ddfisher Jul 18, 2024

daxpedda Jul 18, 2024

ddfisher commented Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

daxpedda Jul 18, 2024

	/// prevent_default_listener.forget();
	/// prevent_default_listener.into_js_value();

		/// This example calls `event.preventDefault()` for all relevant events except for ctrl-c,
		/// ctrl-x, and ctrl-v.

		/// `touchstart`, `wheel`, `contextmenu`, `pointerdown`, `pointermove` (for chorded button
		/// interactions only), `keyup`, and `keydown`.

		/// # Example
		/// This example calls `event.preventDefault()` for all relevant events except for ctrl-p.

		/// # window.set_prevent_default(false);
		/// # add_prevent_default_listeners(window.canvas().unwrap());

Add docs about how to get more fine-grained control of event.preventDefault() calls on web #3451

Are you sure you want to change the base?

Add docs about how to get more fine-grained control of event.preventDefault() calls on web #3451

Conversation

ddfisher commented Feb 2, 2024

daxpedda left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ddfisher commented Jul 18, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment