Jasmine: How to mock MutationObserver?

问题

I have a angularjs component,

HTML template

<div id="panel" class="hide-div">
   <div id="viewPort" class="hide-div">
    ...
   </div>
</div>

JS

var myController = function() {
    var ctrl=this;
    ctrl.$onchanges = function() {

    }

    var source = $("#viewport");
    var target = $("#panel");
    var observer = new MutationObserver(function() {
       target.toggleClass("hide-div", source.hasClass("hide-div"));
     });
    observer.observe($("#viewport")[0], {attributes: true});
}

var config = {
    controller: [myController],
    templateUrl: "temp/abc.html",
    bindings: {
        id: "<",
        name: "<"
    }
};

directives.component("myComponent", config);

Here I have MutationObserver which add/removes the class by observing other elements attribute

Jasmine script Here I am setting up the script for all the test cases

beforeEach(inject(function($rootScope,  $compile, _$componentController_, ...){
    $templateCache.put("temp/abc.html", "<div><div id='panel' /><div id='viewport' /></div>");
    rootScope = $rootScope;
    scope = $rootScope.$new();
    $componentController = _$componentController_;
    element = angular.element("<my-component></my-component>");
    element = $compile(element)(scope);
    ctrl = $componentController("myComponent", null, componentBining);
}));

Here I am getting the following error,

NotFoundError: NotFoundError: DOM Exception 8 in temp/abc.html observe@[native code]

来源：https://stackoverflow.com/questions/50398703/jasmine-how-to-mock-mutationobserver