fix: unsafe attribute reference (#129)

Fixes an unsafe reference that can throw an error in `debugDOM` when it receives a reference to a `document` in a real browser (ie puppeteer/codepen)

<!--
Thanks for your interest in the project. Bugs filed and PRs submitted are appreciated!

Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).

Also, please make sure you're familiar with and follow the instructions in the
contributing guidelines (found in the CONTRIBUTING.md file).

If you're new to contributing to open source projects, you might find this free
video course helpful: http://kcd.im/pull-request

Please fill out the information below to expedite the review and (hopefully)
merge of your pull request!
-->

<!-- What changes are being made? (What feature/bug is being fixed here?) -->

**What**:

<!-- Why are these changes necessary? -->

**Why**:

<!-- How were these changes implemented? -->

**How**:

<!-- Have you done all of these things?  -->

**Checklist**:

<!-- add "N/A" to the end of each line that's irrelevant to your changes -->

<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->

- [ ] Documentation
- [ ] Tests
- [ ] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->
- [ ] Added myself to contributors table <!-- this is optional, see the contributing guidelines for instructions -->

<!-- feel free to add additional comments -->

Author: alexkrolick

src/__tests__/element-queries.js

@@ -1,5 +1,5 @@
 import 'jest-dom/extend-expect'
-import {render} from './helpers/test-utils'
+import {render, renderIntoDocument} from './helpers/test-utils'
 import document from './helpers/document'
 
 beforeEach(() => {
@@ -486,19 +486,19 @@ test('test the debug helper prints the dom state here', () => {
         })}
     </div>`
 
-  const {getByText} = render(Large) // render large DOM which exceeds 7000 limit
+  const {getByText} = renderIntoDocument(Large) // render large DOM which exceeds 7000 limit
   expect(() => expect(getByText('not present')).toBeTruthy()).toThrowError()
 
   const Hello = `<div data-testid="debugging" data-otherid="debugging">
         Hello World!
     </div>`
-  const {getByTestId} = render(Hello)
+  const {getByTestId} = renderIntoDocument(Hello)
   process.env.DEBUG_PRINT_LIMIT = 5 // user should see `...`
   expect(() => expect(getByTestId('not present')).toBeTruthy()).toThrowError(
-    /\.\.\./,
+    /\.\.\.$/,
   )
 
-  const {getByLabelText} = render(Hello)
+  const {getByLabelText} = renderIntoDocument(Hello)
   process.env.DEBUG_PRINT_LIMIT = 10000 // user shouldn't see `...`
   expect(() =>
     expect(getByLabelText('not present')).toBeTruthy(/^((?!\.\.\.).)*$/),

src/__tests__/helpers/test-utils.js

@@ -8,4 +8,10 @@ function render(html) {
   return {container, ...containerQueries}
 }
 
-export {render}
+function renderIntoDocument(html) {
+  document.body.innerHTML = html
+  const containerQueries = getQueriesForElement(document)
+  return {container: document, ...containerQueries}
+}
+
+export {render, renderIntoDocument}

src/query-helpers.js

@@ -8,7 +8,9 @@ function debugDOM(htmlElement) {
     typeof process !== 'undefined' &&
     process.versions !== undefined &&
     process.versions.node !== undefined
-  const window = htmlElement.ownerDocument.defaultView
+  const window =
+    (htmlElement.ownerDocument && htmlElement.ownerDocument.defaultView) ||
+    undefined
   const inCypress = typeof window !== 'undefined' && window.Cypress
   /* istanbul ignore else */
   if (inCypress) {