'Try to assert value of the '<property_name>' inside of the value function' error while passing children their properties #273
Comments
|
Hi. Thanks for raising this up. However, I cannot reproduce the problem. Here you have a test, which shows that everything works as expected: #274 The template engine returns an update function when called, it makes assertions, but the function is not called when the If you have that error, it means, that you must directly set a property value inside of that get call of Can you provide a call stack of that error? Or simplify the example, still keeping the error. I think it might be helpful, to show where exactly the assertion is made. |
smalluban
added
render
|
Sure ! I'll try to provide as much information as I can. Considering the previous example with [email protected], I get the following stack trace (in the web console): Now regarding the components, the parent element's definition looks like this: define<InternalLinkPopoverElement>({
tag: TAG,
gettext_provider: (host, gettext_provider) => gettext_provider,
sanitized_link_href: (host: InternalLinkPopoverElement): string => sanitizeURL(host.link_href),
link_href: (host, link_href) => link_href,
// [...]
render: {
shadow: false,
value: (host) => renderLinkPopover(host, host.gettext_provider),
},
});The define<InternalOpenLinkButtonElement>({
tag: TAG,
gettext_provider: (host, gettext_provider) => gettext_provider,
sanitized_link_href: "",
render: (host) => renderOpenLinkButton(host, host.gettext_provider),
});and its render function: export const renderOpenLinkButton = (
host: InternalOpenLinkButtonElement,
gettext_provider: GetText,
): UpdateFunction<InternalOpenLinkButtonElement> => html`
<div class="tlp-button-bar-item">
<a
class="tlp-button-outline tlp-button-secondary tlp-button-small"
title="${gettext_provider.gettext("Open link")}"
href="${host.sanitized_link_href}"
target="_blank"
data-test="open-link-button"
>
<i class="fa-solid fa-external-link-alt" role="img"></i>
</a>
</div>
`;Thank you for your time, I hope it helps :) |
|
Thanks for the details. I know how to fix it, still not removing the constraint completely, but I would like to understand why it happens first. I'll look at this on Monday or later. Until I fix it, please keep the latest version without the bug. |
|
After a while, I found a case, where it throws - the |
|
Hello, We have successfully upgraded to [email protected] without any problem 🎉 Thank you for the fix! |
part of story #38627 : Choice of a new Rich Text Editor Currently, the design of the popover buttons inclusion is not really good: - Each button element must extend a "type" property, but needs to omit it in their component definition (in order to not have to define a readonly property). - We need a button-creator to render each button. It has to somehow pass the props to the buttons so they can render themselves. In short, this is kind of a mess. We had to establish this strategy because there were a bug in hybrids preventing us to pass children components their properties ([see GH issue](hybridsjs/hybrids#273)). Now it has been corrected, and that hybrids has been successfully upgraded to version 9.1.6 in the whole codebase, then we can refactor the current popover buttons inclusion system to make it simpler and more convenient to use. -- no functional change expected Change-Id: Iff689add5532b1d0ea6a5ae15f2b7218402d5e4f
Hello!
We've been using Hybrids for a while now (and we love it), and it appears that in the latest versions (starting from 9.1.2), passing properties to hybrids children custom elements inside another hybrids custom element's render function makes the component crash with a
Try to assert value of the '<property_name>' inside of the value functionerror.After a bit of research, the error we get seems related to fix(cache): throw an error when assert while getting the value.
In some of our components, we have hybrids custom elements inside some other hybrids custom elements:
This render function works fine with [email protected].
This error prevents us to upgrade to the latest version (9.1.5 at the time of writing).
We couldn't find any documentation about it, and there is not that much of context around the patch mentioned above.
What is the right way to pass children custom elements their properties ? What are we doing wrong?
Best regards!
The text was updated successfully, but these errors were encountered: