bugfix for #42 #48
bugfix for #42 #48
Conversation
vcolavin
added
the
bug
| @@ -76,8 +76,84 @@ export namespace Components { | |||
| } | |||
| } | |||
|
|
|||
| declare global { | |||
There was a problem hiding this comment.
I'm not sure why stencil decided to make all these changes.
There was a problem hiding this comment.
This happened when I ran npm test 😬
There was a problem hiding this comment.
I think this is fine. Stencil automatically generates this file for typings while you are developing. I'm not 100% sure if we can ignore it but it feels safer to leave it in.
There was a problem hiding this comment.
This looks good to me. I'm going to merge it. This also appears to handle the following cases like:
<calcite-switch name="baz" value="woo">
<input id="switch-2" type="checkbox" checked name="foo" value="bar">
</calcite-switch>
So only the things on <input> "win" and get synced up to the component.
| } | ||
|
|
||
| private syncProxyInput() { | ||
| private syncThisToProxyInput = () => { |
There was a problem hiding this comment.
| private syncThisToProxyInput = () => { | |
| function syncFromProxyInput() { |
Perhaps this? It feels both more readable as a class method rather then a property that is an arrow function and the function name seems more understandable.
There was a problem hiding this comment.
Nevermind I totally just realized why you are using an arrow function here because now you don't have to bind the callback.
I do really thing syncThisToProxyInput is confusing. I like syncFromProxyInput and syncToProxyInput better.
| this.value = this.inputProxy.value; | ||
| }; | ||
|
|
||
| private syncProxyInputToThis = () => { |
There was a problem hiding this comment.
Perhaps in the same vein as my above comments I think this should be syncToProxyInput. The renames mean you end up writing code like this.syncToProxyInput() and this.syncfromProxyInput.
Check out #42 for a description. Basically, if you passed in an
inputwith a name or value, those attributes would be trampled by custom component.I used a mutation observer as suggested by @patrickarlt to watch for changes on the child element. The custom component and child input now stay in sync.
I tested that this works, but I don't have an automated test for it. If that is a requirement please let me know and I'll write one!