Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow previously diffed elements to be updated #315

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

tbranyen
Copy link
Owner

@tbranyen tbranyen commented Jul 14, 2023

Removes a mount's transaction state when it is attached to another mount, via Transaction.create. This allows it to be re-used as a mount in future transactions.

Fixes GH-314

@tbranyen
Copy link
Owner Author

Holding off on merging this since I feel there is probably a better way of solving this. Clearly something is being disconnected when appendChild comes into play. When I do some investigating I find that the previously rendered tree for a DOM node that is appended into a different mount resolves to an isolated DOM Node that isn't attached to anything. This is why the unit test in this PR was failing. When I delete the StateCache in this PR, I'm effectively forcing diffHTML to recalculate and restore the VTree->DOM node relationship to the correct node in the DOM.

@tbranyen
Copy link
Owner Author

tbranyen commented Jul 31, 2023

I noticed the test only fails once the inner span is set to 'Test 2' this means it's not actually a problem that the P tag was previously rendered. It looks to be an issue with rendering the span and it gets detached from the paragraph somehow.

       it('will support diffing an element with a StateCache', function () {          
         const p = document.createElement("p");                                       
                                                                                      
         // Create the StateCache on <p/>                                             
         diff.innerHTML(p, "<span>Test</span>");                                      
                                                                                      
         diff.innerHTML(this.fixture, p); // append p into the fixture div            
                                                                                      
        // commenting this out makes the test pass
       // diff.innerHTML(this.fixture.querySelector("span"), "Test 2");                
                                                                                      
         diff.innerHTML(this.fixture.querySelector("p"), "<span>Test 3</span>");   
                                                                                      
         assert.equal(this.fixture.querySelector("span").innerHTML, "Test 3");        
       });                                                                            
     });        

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

innerHTML fails to diff element when its children have been diffed previously
1 participant