Estoy desarrollando una extensión de Chrome similar a Grammarly. Veo que Grammarly está inyectando su botón G en el cuadro de texto de todas las páginas web. Como en esta imagen: botón G dentro del cuadro de texto en la esquina inferior derecha

¿Cómo lo hicieron? Intenté agregar un div usando el script de contenido, pero algunas páginas aún evitan que se muestre. Esto es lo que probé (propósito de prueba):

 let div = document.createElement('div'); div.innerHTML = "<strong>Hi there!</strong> You've read an important message."; document.body.append(div);

Entonces, ¿cómo logra Grammarly esa funcionalidad? ¿Cómo hacerlo con el paquete react-shadow? o alguna otra solución para hacerlo en React? Usé shadow-dom pero está bloqueando todo el dom. Y mostrando el último elemento. Por supuesto, no quiero ese efecto. ¿Cómo implementar exactamente como lo hizo Grammarly?