Add pointer events and focus handling for apps run in a Shadow DOM (#5627)

* [x] I have followed the instructions in the PR template

This PR handles pointer events and focus which did following changes:
- `element_from_point` and focus is now acquired from root node object
by using `get_root_node` from document or a shadow root.
- `TextAgent` is appended individually in each shadow root.

These changes handles pointer events and focus well in a web app that
are running in a shadow dom, or else the hover pointer actions and
keyboard input events are not triggered in a shadow dom.
Helpful for building embeddable/multi-view web-apps.

crates/eframe/src/web/text_agent.rs

@@ -4,6 +4,7 @@
 use std::cell::Cell;
 
 use wasm_bindgen::prelude::*;
+use web_sys::{Document, Node};
 
 use super::{AppRunner, WebRunner};
 
@@ -14,7 +15,7 @@ pub struct TextAgent {
 
 impl TextAgent {
     /// Attach the agent to the document.
-    pub fn attach(runner_ref: &WebRunner) -> Result<Self, JsValue> {
+    pub fn attach(runner_ref: &WebRunner, root: Node) -> Result<Self, JsValue> {
         let document = web_sys::window().unwrap().document().unwrap();
 
         // create an `<input>` element
@@ -37,7 +38,17 @@ impl TextAgent {
         style.set_property("position", "absolute")?;
         style.set_property("top", "0")?;
         style.set_property("left", "0")?;
-        document.body().unwrap().append_child(&input)?;
+
+        if root.has_type::<Document>() {
+            // root object is a document, append to its body
+            root.dyn_into::<Document>()?
+                .body()
+                .unwrap()
+                .append_child(&input)?;
+        } else {
+            // append input into root directly
+            root.append_child(&input)?;
+        }
 
         // attach event listeners