Browser Plugin: Update DOM Node attributes when properties are updated

chrome/renderer/resources/extensions/web_view.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // Shim that simulates a <webview> tag via Mutation Observers.
 //
 // The actual tag is implemented via the browser plugin. The internals of this
 // are hidden via Shadow DOM.
 
 var WEB_VIEW_ATTRIBUTES = ['src', 'partition'];
@@ skipping 72 matching lines @@
   // Map attribute modifications on the <webview> tag to property changes in
   // the underlying <object> node.
   var handleMutation = this.handleMutation_.bind(this);
   var observer = new WebKitMutationObserver(function(mutations) {
     mutations.forEach(handleMutation);
   });
   observer.observe(
       this.node_,
       {attributes: true, attributeFilter: WEB_VIEW_ATTRIBUTES});
 
+  var handleObjectMutation = this.handleObjectMutation_.bind(this);
+  var objectObserver = new WebKitMutationObserver(function(mutations) {
+    mutations.forEach(handleObjectMutation);
+  });
+  objectObserver.observe(
+      this.objectNode_,
+      {attributes: true, attributeFilter: WEB_VIEW_ATTRIBUTES});
+
   var objectNode = this.objectNode_;
   // Expose getters and setters for the attributes.
   WEB_VIEW_ATTRIBUTES.forEach(function(attributeName) {
     Object.defineProperty(this.node_, attributeName, {
       get: function() {
         return objectNode[attributeName];
       },
       set: function(value) {
         objectNode[attributeName] = value;
       },
@@ skipping 16 matching lines @@
 
   for (var eventName in WEB_VIEW_EVENTS) {
     this.setupEvent_(eventName, WEB_VIEW_EVENTS[eventName]);
   }
 }
 
 /**
  * @private
  */
 WebView.prototype.handleMutation_ = function(mutation) {
-  this.node_[mutation.attributeName] =
+  this.objectNode_[mutation.attributeName] =
       this.node_.getAttribute(mutation.attributeName);
 };
 
 /**
  * @private
  */
+WebView.prototype.handleObjectMutation_ = function(mutation) {
+  console.log('observed object mutation');

[sadrul, 2012/12/04 01:28:46]

remove this?

[Fady Samuel, 2012/12/04 01:57:30]

Done.

+  this.node_.setAttribute(mutation.attributeName,
+      this.objectNode_.getAttribute(mutation.attributeName));
+};
+
+/**
+ * @private
+ */
 WebView.prototype.setupEvent_ = function(eventname, attribs) {
   var node = this.node_;
   this.objectNode_.addEventListener('-internal-' + eventname, function(e) {
     var evt = new Event(eventname);
     var detail = e.detail ? JSON.parse(e.detail) : {};
     attribs.forEach(function(attribName) {
       evt[attribName] = detail[attribName];
     });
     node.dispatchEvent(evt);
   });
 }