#10 - clean up document targets and components

src/index.js

@@ -10,7 +10,7 @@ export const render = (Component, {target = document.createElement('div'), ...op
     target,
   })
 
-  mountedContainers.add(component)
+  mountedContainers.add({target, component})
   return {
     component,
     // eslint-disable-next-line no-console
@@ -20,7 +20,11 @@ export const render = (Component, {target = document.createElement('div'), ...op
 }
 
 const cleanupAtContainer = container => {
-  container.$destroy()
+  const {target, component} = container
+  component.$destroy()
+  if (target.parentNode === document.body) {
+    document.body.removeChild(target)
+  }
   mountedContainers.delete(container)
 }
 

tests/render.spec.js

@@ -38,13 +38,17 @@ describe('render', () => {
   })
 
   test('debug', () => {
+    const originalConsole = global.console
+
     global.console = {log: jest.fn()}
 
     const {debug} = render(App)
 
     debug()
 
     expect(global.console.log).toHaveBeenCalledWith(prettyDOM(document.body))
+
+    global.console = originalConsole
   })
 
   test('custom container target', () => {
@@ -61,4 +65,8 @@ describe('render', () => {
     expect(getByText('Hello world!')).toBeInTheDocument()
     expect(getByTestId('custom-target')).toBeInTheDocument()
   })
+
+  test('after each test above, document is clean from targets and components', () => {
+    expect(document.body.innerHTML).toBe('<div></div>')
+  })
 })