diff --git a/src/__tests__/screen.js b/src/__tests__/screen.js
index b1dc5c7c..d9c99d82 100644
--- a/src/__tests__/screen.js
+++ b/src/__tests__/screen.js
@@ -1,9 +1,65 @@
import {renderIntoDocument} from './helpers/test-utils'
import {screen} from '..'
+beforeEach(() => {
+ jest.spyOn(console, 'log').mockImplementation(() => {})
+})
+
+afterEach(() => {
+ console.log.mockRestore()
+})
+
test('exposes queries that are attached to document.body', async () => {
renderIntoDocument(`
hello world
`)
screen.getByText(/hello world/i)
await screen.findByText(/hello world/i)
expect(screen.queryByText(/hello world/i)).not.toBeNull()
})
+
+test('exposes debug method', () => {
+ renderIntoDocument(
+ `multi-testmulti-test
`,
+ )
+ // log document
+ screen.debug()
+ expect(console.log).toHaveBeenCalledTimes(1)
+ expect(console.log.mock.calls[0][0]).toMatchInlineSnapshot(`
+ "
+
+
+ multi-test
+
+
+ multi-test
+
+ "
+ `)
+ console.log.mockClear()
+ // log single element
+ screen.debug(screen.getByText('test', {selector: 'button'}))
+ expect(console.log).toHaveBeenCalledTimes(1)
+ expect(console.log.mock.calls[0][0]).toMatchInlineSnapshot(`
+ ""
+ `)
+ console.log.mockClear()
+ // log multiple elements
+ screen.debug(screen.getAllByText('multi-test'))
+ expect(console.log).toHaveBeenCalledTimes(2)
+ expect(console.log.mock.calls[0][0]).toMatchInlineSnapshot(`
+ "
+ multi-test
+ "
+ `)
+ expect(console.log.mock.calls[1][0]).toMatchInlineSnapshot(`
+ "
+ multi-test
+
"
+ `)
+ console.log.mockClear()
+})
+
+/* eslint no-console:0 */
diff --git a/src/get-queries-for-element.js b/src/get-queries-for-element.js
index 3ddda7e0..cc81578b 100644
--- a/src/get-queries-for-element.js
+++ b/src/get-queries-for-element.js
@@ -7,14 +7,19 @@ import * as defaultQueries from './queries'
/**
* @param {HTMLElement} element container
* @param {FuncMap} queries object of functions
+ * @param {Object} initialValue for reducer
* @returns {FuncMap} returns object of functions bound to container
*/
-function getQueriesForElement(element, queries = defaultQueries) {
+function getQueriesForElement(
+ element,
+ queries = defaultQueries,
+ initialValue = {},
+) {
return Object.keys(queries).reduce((helpers, key) => {
const fn = queries[key]
helpers[key] = fn.bind(null, element)
return helpers
- }, {})
+ }, initialValue)
}
export {getQueriesForElement}
diff --git a/src/screen.js b/src/screen.js
index 51b25416..f6768c6b 100644
--- a/src/screen.js
+++ b/src/screen.js
@@ -1,14 +1,23 @@
import * as queries from './queries'
import {getQueriesForElement} from './get-queries-for-element'
+import {logDOM} from './pretty-dom'
+
+const debug = (element, maxLength, options) =>
+ Array.isArray(element)
+ ? element.forEach(el => logDOM(el, maxLength, options))
+ : logDOM(element, maxLength, options)
export const screen =
typeof document !== 'undefined' && document.body
- ? getQueriesForElement(document.body)
- : Object.keys(queries).reduce((helpers, key) => {
- helpers[key] = () => {
- throw new TypeError(
- 'For queries bound to document.body a global document has to be available... Learn more: https://testing-library.com/s/screen-global-error',
- )
- }
- return helpers
- }, {})
+ ? getQueriesForElement(document.body, queries, {debug})
+ : Object.keys(queries).reduce(
+ (helpers, key) => {
+ helpers[key] = () => {
+ throw new TypeError(
+ 'For queries bound to document.body a global document has to be available... Learn more: https://testing-library.com/s/screen-global-error',
+ )
+ }
+ return helpers
+ },
+ {debug},
+ )