bUnit icon indicating copy to clipboard operation
bUnit copied to clipboard

Get IRenderedFragment/IRenderedComponent<T> from DOM element (IElement)

Open egil opened this issue 4 years ago • 4 comments

In certain scenarios (#152), it can make it easier to create test when it is possible to get a component from a DOM element, due to the good DOM query (Find/FindAll) API.

Thus, it should be possible to go from an node to the component that rendered it.

The API could have two methods, GetComponent and GetComponent<TComponent>, and they should return a IRenderedFragment or IRenderedComponent<MyComp>, which is related to the nearest component in the render tree, that rendered the element. E.g.:

var elm = cut.Find("p");
IRenderedFragment componentThatRenderedElm = elm.GetComponent();
IRenderedComponent<MyComp> componentThatRenderedElm = elm.GetComponent<MyComp>();

It should be possible by adding meta information to the DOM tree created by the Htmlizer.cs type, and creating extension methods on INode that reads up the DOM tree until it finds some meta information about the source component. That extension method can then get the renderer and use its methods to find the component instance.

Update

With the current render pipeline, where we generate markup with Htmlizer and then convert to AngleSharp nodes does seems to contain too many compromises when info about the source component should be embedded in the nodes in the dom tree, at least for the variants I've tried, so I will move this item over to the AngleSharpRenderer project, where it will be a completely different store.

I tried adding custom <!--!X--> comments to markup in Htmlizer, but doing so had too much impact on other parts of the system. Another variant added a custom attribute to the first element in a component, the reasoning being that elements are what users query from using Find/FindAll. However, if a component simply contained a markup string, and not calls to "OpenElement", then the components would not get the attribute.

egil avatar Jun 18 '20 16:06 egil

I am not sure about the name of the method. The method should return the component that rendered the element, but calling it GetComponent my lead some to think it will get a component which is a child of the element.

GetOwningComponent, GetSourceComponent, GetRenderingComponent are some other options.

egil avatar Oct 08 '20 16:10 egil

As DOM elwlents are owned by components, elm.GetOwningComponent()

mrpmorris avatar Oct 08 '20 22:10 mrpmorris

Does anyone know how to go from IRenderedFragment to IElement? Trying to assert css styles and ComputeCurrentStyle only exists on IElement

mycarrysun avatar Jul 12 '22 18:07 mycarrysun

Does anyone know how to go from IRenderedFragment to IElement? Trying to assert css styles and ComputeCurrentStyle only exists on IElement

Hey @mycarrysun can I kindly ask you to open a new discussion in the discussion tab? That would be a better place as this issue tracks something else.

linkdotnet avatar Jul 12 '22 18:07 linkdotnet