feat(config): Add showLogOnfail config option to configure logging

davidsa · davidsa · commit 9cc7ce91b8ed · 2020-03-03T13:47:29.000-05:00
diff --git a/src/__tests__/__snapshots__/get-by-errors.js.snap b/src/__tests__/__snapshots__/get-by-errors.js.snap
@@ -0,0 +1,25 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`getByLabelText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find a label with the text of: TEST QUERY"`;
+
+exports[`getByLabelText query will throw expected error message when config.showLogOnFail is true 1`] = `
+"Unable to find a label with the text of: TEST QUERY
+
+<body>
+  <div>
+    Hello
+  </div>
+</body>"
+`;
+
+exports[`getByText query will throw expected error message when config.showLogOnFail is false 1`] = `"Unable to find an element with the text: TEST QUERY. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible."`;
+
+exports[`getByText query will throw expected error message when config.showLogOnFail is true 1`] = `
+"Unable to find an element with the text: TEST QUERY. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
+
+<body>
+  <div>
+    Hello
+  </div>
+</body>"
+`;
diff --git a/src/__tests__/get-by-errors.js b/src/__tests__/get-by-errors.js
@@ -1,6 +1,13 @@
 import cases from 'jest-in-case'
+import {screen} from '../'
+import {configure, getConfig} from '../config'
 import {render} from './helpers/test-utils'
 
+const originalConfig = getConfig()
+beforeEach(() => {
+  configure(originalConfig)
+})
+
 cases(
   'getBy* queries throw an error when there are multiple elements returned',
   ({name, query, html}) => {
@@ -39,6 +46,20 @@ cases(
   },
 )
 
+test.each([
+  ['getByText', true],
+  ['getByText', false],
+  ['getByLabelText', true],
+  ['getByLabelText', false],
+])(
+  '%s query will throw expected error message when config.showLogOnFail is %s',
+  (query, showLogOnFail) => {
+    configure({showLogOnFail})
+    document.body.innerHTML = '<div>Hello</div>'
+    expect(() => screen[query]('TEST QUERY')).toThrowErrorMatchingSnapshot()
+  },
+)
+
 cases(
   'queryBy* queries throw an error when there are multiple elements returned',
   ({name, query, html}) => {
diff --git a/src/config.js b/src/config.js
@@ -14,6 +14,9 @@ let config = {
   asyncWrapper: cb => cb(),
   // default value for the `hidden` option in `ByRole` queries
   defaultHidden: false,
+
+  // should the DOM be logged to the console when getBy* or getAllBy* query fail
+  showLogOnFail: true,
 }
 
 export function configure(newConfig) {
diff --git a/src/query-helpers.js b/src/query-helpers.js
@@ -1,9 +1,13 @@
 import {prettyDOM} from './pretty-dom'
 import {fuzzyMatches, matches, makeNormalizer} from './matches'
 import {waitForElement} from './wait-for-element'
+import {getConfig} from './config'
 
 function getElementError(message, container) {
-  return new Error([message, prettyDOM(container)].filter(Boolean).join('\n\n'))
+  const errorMessages = getConfig().showLogOnFail
+    ? [message, prettyDOM(container)]
+    : [message]
+  return new Error(errorMessages.filter(Boolean).join('\n\n'))
 }
 
 function getMultipleElementsFoundError(message, container) {

Original file line number	Diff line number	Diff line change
`@@ -14,6 +14,9 @@ let config = {`
`14`	`14`	`asyncWrapper: cb => cb(),`
`15`	`15`	// default value for the `hidden` option in `ByRole` queries
`16`	`16`	`defaultHidden: false,`
	`17`	`+`
	`18`	`+ // should the DOM be logged to the console when getBy* or getAllBy* query fail`
	`19`	`+ showLogOnFail: true,`
`17`	`20`	`}`
`18`	`21`
`19`	`22`	`export function configure(newConfig) {`