Using web components with Cell #181
Description
Should custom web components work with Cell?
I'm finding that web components don't work when their property names conflict with tag attribute names.
For example (using Chromium - Firefox web component support is lagging) , this Elix text area works:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<script src='https://www.celljs.org/cell.js'></script>
<script type='module' src='https://component.kitchen/modules/AutosizeTextarea.js'></script>
</head>
<script>
var myElixTextArea = {
$cell: true,
$type: 'elix-autosize-textarea',
'minimum-rows': 2,
}
</script>
</html>
But when a placeholder property is is added:
var myElixTextArea = {
$cell: true,
$type: 'elix-autosize-textarea',
'minimum-rows': 2,
placeholder: 'Type here'
}
Error is thrown:
Uncaught RangeError: Maximum call stack size exceeded.