vNode created via toVNode looses dataset since 3.4.0 release
dperrymorrow opened this issue · comments
Forgive me if im wrong, but it seems like since 3.4.0 release and #976 was merged. creating a vNode via toVNode
and then patching with that node, dataset is lost.
https://stackblitz.com/edit/js-znkhkf?file=index.js
example:
import { datasetModule, init, toVNode } from 'snabbdom';
const patch = init([datasetModule]);
const $container = document.getElementById('app');
const $tmp = document.createElement('div');
$tmp.innerHTML = `<h1 data-something="yes">hello</h1>`;
const newNode = toVNode($tmp);
patch($container, newNode);
If i roll back to 3.3.1 its works as expected. Perhaps toVNode
just missed an update with the above mentioned change?
This is still an issue since @nexteditorjs only partially fixed. It only correct works if data attributes has not having dash in names (which is valid data name see https://reference.codeproject.com/dom/HTMLElement/dataset).
// See https://www.npmjs.com/package/snabbdom documentation.
import * as snabbdom from 'https://esm.run/snabbdom';
const patch = snabbdom.init([snabbdom.datasetModule]);
const $container = document.getElementById('app');
const $tmp = document.createElement('div');
/* $tmp.innerHTML = `<h1 data-something="yes">hello</h1>`; */
$tmp.innerHTML = `<h1 data-some-thing="yes">hello</h1>`;
const newNode = snabbdom.toVNode($tmp);
patch($container, newNode);
This will although a valid html string, throw an error. (can be checked https://jsfiddle.net/u251gbn8/)
This was already reported on #1031 but for some reason this issue was closed.
If you using DOMStringMap
to set dataset elements but you should also replace -
following with a letter with letter which is transformed into its uppercase counterpart;
Best regards,
Nikola