How to use the @testing-library/dom.getQueriesForElement function in @testing-library/dom

// Intentionally do not return anything to avoid unnecessarily complicating the API.
      // folks can use all the same utilities we return in the first place that are bound to
      // the container
    },
    asFragment: () => {
      if (typeof document.createRange === 'function') {
        return document
          .createRange()
          .createContextualFragment(container.innerHTML)
      }

      const template = document.createElement('template')
      template.innerHTML = container.innerHTML
      return template.content
    },
    ...dtl.getQueriesForElement(baseElement, queries)
  }
}

// eslint-disable-next-line no-new
      const newComponent = new ComponentConstructor({
        ...options,
        target
      })

      containerCache.set(container, { target, newComponent })
      componentCache.add(newComponent)

      newComponent.$$.on_destroy.push(() => { componentCache.delete(newComponent) })
    },
    unmount: () => {
      if (componentCache.has(component)) component.$destroy()
    },
    ...getQueriesForElement(container, queries)
  }
}

// Intentionally do not return anything to avoid unnecessarily complicating the API.
      // folks can use all the same utilities we return in the first place that are bound to the container
    },
    asFragment: () => {
      /* istanbul ignore if (jsdom limitation) */
      if (typeof document.createRange === 'function') {
        return document
          .createRange()
          .createContextualFragment(container.innerHTML)
      }

      const template = document.createElement('template')
      template.innerHTML = container.innerHTML
      return template.content
    },
    ...getQueriesForElement(baseElement, queries),
  }
}

test('renders a number input with a label "Favorite Number"', () => {
  const div = document.createElement('div')
  ReactDOM.render(, div)
  const {getByLabelText} = getQueriesForElement(div)
  const input = getByLabelText(/favorite number/i)
  expect(input).toHaveAttribute('type', 'number')
})

}

  return {
    fixture,
    detectChanges,
    navigate,
    rerender,
    debugElement: fixture.debugElement.query(By.directive(sut)),
    container: fixture.nativeElement,
    debug: (element = fixture.nativeElement) => console.log(prettyDOM(element)),
    type: createType(eventsWithDetectChanges),
    selectOptions: createSelectOptions(eventsWithDetectChanges),
    waitForDomChange: componentWaitForDomChange,
    waitForElement: componentWaitForElement,
    waitForElementToBeRemoved: componentWaitForElementToBeRemoved,
    ...getQueriesForElement(fixture.nativeElement, queries),
    ...eventsWithDetectChanges,
  };
}

return {
    get component() {
      return component
    },
    debug: (el = container) => console.log(prettyDOM(el)),
    container,
    unmount: () => cleanupAtContainer({ target, component}),
    rerender: (options) => {
      if(component) {
        component.unmount(true);
      }
      const newComponent = ui(target, options);
      mountedContainers.set(target, { target, component: newComponent })
      component = newComponent
    },
    ...getQueriesForElement(target),
  }
}

container.appendChild(wrapper.element)

  return {
    container,
    baseElement,
    debug: (el = baseElement) =>
      Array.isArray(el) ? el.forEach(e => logDOM(e)) : logDOM(el),
    unmount: () => wrapper.destroy(),
    isUnmounted: () => wrapper.vm._isDestroyed,
    html: () => wrapper.html(),
    emitted: () => wrapper.emitted(),
    updateProps: _ => {
      wrapper.setProps(_)
      return wait()
    },
    ...getQueriesForElement(baseElement),
  }
}

function render(preactNodeToRender, {container} = {}) {
  if (!container) {
    container = document.body.appendChild(document.createElement('div'));
  }

  renderedComponents.add(container);
  preactRender(preactNodeToRender, container);

  return {
    container,
    ...testingLibrary.getQueriesForElement(container),
  };
}