How to I tell when HTML of a webpage has changed dynamically from javascript? CefSharp

Question

I have a CefSharp browser control that loads a page running javascript EventSource(). The page adds an element each time a message is returned by event source. How can I tell once this element has been added? The event stream never ends so I don't think I could do it with any loading complete handlers. Something like OnHTMLContentChanged is what I am looking for. Below is the html of the webpage. When this happens (document.getElementById("result").innerHTML += event.data + "<br>"), I need my c# code to know.

<!DOCTYPE html>
<html>
<body>

<div id="result"></div>

<script>
if(typeof(EventSource) !== "undefined") {
  var source = new EventSource("https://example.com/api/stream");
  source.onmessage = function(event) {
    document.getElementById("result").innerHTML += event.data + "<br>";
  };
} else {
  document.getElementById("result").innerHTML = "Sorry, your browser does not support server-sent events...";
}
</script>

Are you looking for *any* changes to the DOM? If so - this solution might work for you https://stackoverflow.com/questions/3219758/detect-changes-in-the-dom — dalekman1234, Mar 05 '22 at 00:03
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver best to add some more generic tags if you require further assistance. JavaScript/html etc — amaitland, Mar 05 '22 at 01:46

Code Base · Accepted Answer · 2022-03-08T06:05:38.057

2

UPDATE! I solved the issue. In CefSharp you can use the CefSharp.PostMessage() function to send a message back to your C# code. link to question that solved my problem

edited Mar 08 '22 at 06:05

answered Mar 05 '22 at 21:01

Code Base

93
8

Hi and welcome! I suggest you review your answer to add appropriate link description and add related tags. Again, welcome! – OldFart Mar 05 '22 at 23:27

How to I tell when HTML of a webpage has changed dynamically from javascript? CefSharp

1 Answers1