Mutation observer on iframe is not fired when used as target in a form for php output.
When change is made from within the java script with
targetNode.innerHTML = 'xxx';
the observer fires.
When the output of a php file is displayed by the form in the iframe, nothing happens.
What am I doing wrong ?
Here is thet HTML/JavaScript
<!DOCTYPE html>
<html>
<head>
<title>Mutation Test</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<form action="dummy.php" target='iframe'>
<input type='submit'>
</form>
<iframe name='iframe'></iframe>
<script >
targetNode = document.querySelector('IFRAME').contentDocument.body;
config = {childList: true, subtree: true, attributes: true};
callback = function (mutationsList, observer) {
alert('mutation');
};
observer = new MutationObserver(callback);
observer.observe(targetNode, config);
//targetNode.innerHTML = 'xxx'; //<= this will trigger a mutaion !!!!!!!!!!!!!
</script>
</body>
</html>
Here is the php file used as the action for the form
<?php
echo "dummy.php";