[Bug 20913] [Custom]: Meaning of prototype in document.register is underspecified

https://www.w3.org/Bugs/Public/show_bug.cgi?id=20913

--- Comment #22 from Daniel Buchner <danieljb2@gmail.com> ---
(In reply to comment #21)
> > "Instead, there's the same syntax for both ES6 and ES5/3" - I don't see how
> > this is at all possible to polyfill, because HTMLScriptElement.call(this);
> > throws.
> 
> This problem exists for polyfilling regardless of how you frame the syntax,
> and we have already discussed ways around it, no?
> 
> > Developers rarely, if ever, use native element constructors in the wild
> > because only a handful are supported: Image, Option, etc. Now let's be
> > clear, developers use non-DOM/element related user-code constructors for
> > their own objects, but given there are only a few working element
> > constructors as it is, I assure you they won't miss what they never had.
> 
> I think it's a mistake for any one of us to claim the inside scoop on
> developers. Personally I agree with Dimitri et al, that moving towards
> proper constructors is a positive. As I suggest above, I don't think it
> causes the problem you think it does.
> 
> > I think you'd be surprised to what extent developers prefer option objects
> > in widgets and object instantiations, it is actually the most common pattern
> > in all major libraries today.
> 
> If we can define precisely the information we are talking about, we can
> probably reach agreement about the best place to specify/store these things.
> I don't believe there is a philosophical rightness here.

Let me frame this with some examples:

Someone posted this:

function SuperScript() {
   HTMLScriptElement.call(this);
   var root = this.createShadowRoot();
   root.innerHTML = "BEHOLD TEH SUPPERRRR SCRIPT!!!"
}
SuperScript.prototype = Object.create(HTMLScriptElement.prototype);
document.register("super-script", SuperScript);

and compared it to this:

document.register("super-script", {
  prototype: Object.create(HTMLScriptElement.prototype),
  lifecycle: {
     shadowRootCreated(root) {
        root.innerHTML = "BEHOLD TEH SUPPERRRR SCRIPT!!!";
     }
  }
});

Let's look at a more real-world example (threw this together pretty quickly,
forgive any errors please) that uses the common observer functionality we've
observed used widely in component creation:

document.register("draggable-product", {
  prototype: Object.create(HTMLDivElement.prototype),
  lifecycle: {
     inserted: function(){
         if (this.parentNode.nodeName == 'shopping-cart') {
             this.doPriceCheck(function(data){
                 alert('There is ' + data.isOnSale ? 'an' : 'no' + ' in-cart
discount.');
                 if (this.attachedCart)
this.attachedCart.addProductToTotal(this);
             });
             this.attachedCart = this.parentNode;
         }
     },
     removed: function(){
         if (this.attachedCart) this.attachedCart.removeProductFromTotal(this);
         this.attachedCart = null;
     },
  }
});

Can you show me what this would look like in a polyfilled version that uses a
function constructor and declares the 'inserted' and 'removed' actions within
it?

-- 
You are receiving this mail because:
You are the QA Contact for the bug.

Received on Tuesday, 12 February 2013 16:30:05 UTC