diff --git a/package.json b/package.json index 0cbd8b26..8a8e2466 100644 --- a/package.json +++ b/package.json @@ -37,8 +37,6 @@ "chalk": "^3.0.0", "css": "^3.0.0", "css.escape": "^1.5.1", - "jest-diff": "^25.1.0", - "jest-matcher-utils": "^25.1.0", "lodash": "^4.17.15", "redent": "^3.0.0" }, diff --git a/src/__tests__/utils.js b/src/__tests__/utils.js index ec67a43a..43a16124 100644 --- a/src/__tests__/utils.js +++ b/src/__tests__/utils.js @@ -22,10 +22,22 @@ test('deprecate', () => { }) describe('checkHtmlElement', () => { + let assertionContext + beforeAll(() => { + expect.extend({ + fakeMatcher() { + assertionContext = this + + return {pass: true} + }, + }) + + expect(true).fakeMatcher(true) + }) it('does not throw an error for correct html element', () => { expect(() => { const element = document.createElement('p') - checkHtmlElement(element, () => {}, {}) + checkHtmlElement(element, () => {}, assertionContext) }).not.toThrow() }) @@ -35,25 +47,25 @@ describe('checkHtmlElement', () => { 'http://www.w3.org/2000/svg', 'rect', ) - checkHtmlElement(element, () => {}, {}) + checkHtmlElement(element, () => {}, assertionContext) }).not.toThrow() }) it('does not throw for body', () => { expect(() => { - checkHtmlElement(document.body, () => {}, {}) + checkHtmlElement(document.body, () => {}, assertionContext) }).not.toThrow() }) it('throws for undefined', () => { expect(() => { - checkHtmlElement(undefined, () => {}, {}) + checkHtmlElement(undefined, () => {}, assertionContext) }).toThrow(HtmlElementTypeError) }) it('throws for document', () => { expect(() => { - checkHtmlElement(document, () => {}, {}) + checkHtmlElement(document, () => {}, assertionContext) }).toThrow(HtmlElementTypeError) }) @@ -62,7 +74,7 @@ describe('checkHtmlElement', () => { checkHtmlElement( () => {}, () => {}, - {}, + assertionContext, ) }).toThrow(HtmlElementTypeError) }) @@ -77,7 +89,7 @@ describe('checkHtmlElement', () => { }, }, () => {}, - {}, + assertionContext, ) }).toThrow(HtmlElementTypeError) }) diff --git a/src/to-be-checked.js b/src/to-be-checked.js index 2f44add7..bd19fcb4 100644 --- a/src/to-be-checked.js +++ b/src/to-be-checked.js @@ -1,5 +1,4 @@ import {roles} from 'aria-query' -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, toSentence} from './utils' export function toBeChecked(element) { @@ -37,10 +36,14 @@ export function toBeChecked(element) { message: () => { const is = isChecked() ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeChecked`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeChecked`, + 'element', + '', + ), '', `Received element ${is} checked:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-be-disabled.js b/src/to-be-disabled.js index 46c3755f..9efe6f98 100644 --- a/src/to-be-disabled.js +++ b/src/to-be-disabled.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, getTag} from './utils' // form elements that support 'disabled' @@ -70,10 +69,14 @@ export function toBeDisabled(element) { message: () => { const is = isDisabled ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeDisabled`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeDisabled`, + 'element', + '', + ), '', `Received element ${is} disabled:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } @@ -89,10 +92,14 @@ export function toBeEnabled(element) { message: () => { const is = isEnabled ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeEnabled`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeEnabled`, + 'element', + '', + ), '', `Received element ${is} enabled:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-be-empty-dom-element.js b/src/to-be-empty-dom-element.js index 7743cdfa..c3eeb594 100644 --- a/src/to-be-empty-dom-element.js +++ b/src/to-be-empty-dom-element.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toBeEmptyDOMElement(element) { @@ -8,14 +7,14 @@ export function toBeEmptyDOMElement(element) { pass: element.innerHTML === '', message: () => { return [ - matcherHint( + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toBeEmptyDOMElement`, 'element', '', ), '', 'Received:', - ` ${printReceived(element.innerHTML)}`, + ` ${this.utils.printReceived(element.innerHTML)}`, ].join('\n') }, } diff --git a/src/to-be-empty.js b/src/to-be-empty.js index 9985376d..86ee5ca2 100644 --- a/src/to-be-empty.js +++ b/src/to-be-empty.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, deprecate} from './utils' export function toBeEmpty(element) { @@ -12,10 +11,14 @@ export function toBeEmpty(element) { pass: element.innerHTML === '', message: () => { return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeEmpty`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeEmpty`, + 'element', + '', + ), '', 'Received:', - ` ${printReceived(element.innerHTML)}`, + ` ${this.utils.printReceived(element.innerHTML)}`, ].join('\n') }, } diff --git a/src/to-be-in-the-document.js b/src/to-be-in-the-document.js index c0a05331..8dcf5f50 100644 --- a/src/to-be-in-the-document.js +++ b/src/to-be-in-the-document.js @@ -1,8 +1,3 @@ -import { - matcherHint, - stringify, - RECEIVED_COLOR as receivedColor, -} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toBeInTheDocument(element) { @@ -14,7 +9,7 @@ export function toBeInTheDocument(element) { element === null ? false : element.ownerDocument.contains(element) const errorFound = () => { - return `expected document not to contain element, found ${stringify( + return `expected document not to contain element, found ${this.utils.stringify( element.cloneNode(true), )} instead` } @@ -26,13 +21,14 @@ export function toBeInTheDocument(element) { pass, message: () => { return [ - matcherHint( + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toBeInTheDocument`, 'element', '', ), '', - receivedColor(this.isNot ? errorFound() : errorNotFound()), + // eslint-disable-next-line babel/new-cap + this.utils.RECEIVED_COLOR(this.isNot ? errorFound() : errorNotFound()), ].join('\n') }, } diff --git a/src/to-be-in-the-dom.js b/src/to-be-in-the-dom.js index c5c49edd..399c356a 100644 --- a/src/to-be-in-the-dom.js +++ b/src/to-be-in-the-dom.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, deprecate} from './utils' export function toBeInTheDOM(element, container) { @@ -19,10 +18,16 @@ export function toBeInTheDOM(element, container) { pass: container ? container.contains(element) : !!element, message: () => { return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeInTheDOM`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeInTheDOM`, + 'element', + '', + ), '', 'Received:', - ` ${printReceived(element ? element.cloneNode(false) : element)}`, + ` ${this.utils.printReceived( + element ? element.cloneNode(false) : element, + )}`, ].join('\n') }, } diff --git a/src/to-be-invalid.js b/src/to-be-invalid.js index cb476827..c901aca0 100644 --- a/src/to-be-invalid.js +++ b/src/to-be-invalid.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, getTag} from './utils' const FORM_TAGS = ['form', 'input', 'select', 'textarea'] @@ -33,10 +32,14 @@ export function toBeInvalid(element) { message: () => { const is = isInvalid ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeInvalid`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeInvalid`, + 'element', + '', + ), '', `Received element ${is} currently invalid:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } @@ -52,10 +55,14 @@ export function toBeValid(element) { message: () => { const is = isValid ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeValid`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeValid`, + 'element', + '', + ), '', `Received element ${is} currently valid:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-be-partially-checked.js b/src/to-be-partially-checked.js index 1b284985..982665af 100644 --- a/src/to-be-partially-checked.js +++ b/src/to-be-partially-checked.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toBePartiallyChecked(element) { @@ -37,14 +36,14 @@ export function toBePartiallyChecked(element) { message: () => { const is = isPartiallyChecked() ? 'is' : 'is not' return [ - matcherHint( + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toBePartiallyChecked`, 'element', '', ), '', `Received element ${is} partially checked:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-be-required.js b/src/to-be-required.js index e85806d7..d674a62c 100644 --- a/src/to-be-required.js +++ b/src/to-be-required.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, getTag} from './utils' // form elements that support 'required' @@ -60,10 +59,14 @@ export function toBeRequired(element) { message: () => { const is = isRequired ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeRequired`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeRequired`, + 'element', + '', + ), '', `Received element ${is} required:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-be-visible.js b/src/to-be-visible.js index 43c6362b..8837105e 100644 --- a/src/to-be-visible.js +++ b/src/to-be-visible.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' function isStyleVisible(element) { @@ -39,10 +38,14 @@ export function toBeVisible(element) { message: () => { const is = isVisible ? 'is' : 'is not' return [ - matcherHint(`${this.isNot ? '.not' : ''}.toBeVisible`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toBeVisible`, + 'element', + '', + ), '', `Received element ${is} visible:`, - ` ${printReceived(element.cloneNode(false))}`, + ` ${this.utils.printReceived(element.cloneNode(false))}`, ].join('\n') }, } diff --git a/src/to-contain-element.js b/src/to-contain-element.js index fdaf06af..93cc8818 100644 --- a/src/to-contain-element.js +++ b/src/to-contain-element.js @@ -1,8 +1,3 @@ -import { - matcherHint, - stringify, - RECEIVED_COLOR as receivedColor, -} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toContainElement(container, element) { @@ -16,15 +11,18 @@ export function toContainElement(container, element) { pass: container.contains(element), message: () => { return [ - matcherHint( + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toContainElement`, 'element', 'element', ), '', - receivedColor(`${stringify(container.cloneNode(false))} ${ + // eslint-disable-next-line babel/new-cap + this.utils.RECEIVED_COLOR(`${this.utils.stringify( + container.cloneNode(false), + )} ${ this.isNot ? 'contains:' : 'does not contain:' - } ${stringify(element ? element.cloneNode(false) : element)} + } ${this.utils.stringify(element ? element.cloneNode(false) : element)} `), ].join('\n') }, diff --git a/src/to-contain-html.js b/src/to-contain-html.js index cfcede1e..48773304 100644 --- a/src/to-contain-html.js +++ b/src/to-contain-html.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toContainHTML(container, htmlText) { @@ -8,10 +7,14 @@ export function toContainHTML(container, htmlText) { pass: container.outerHTML.includes(htmlText), message: () => { return [ - matcherHint(`${this.isNot ? '.not' : ''}.toContainHTML`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toContainHTML`, + 'element', + '', + ), '', 'Received:', - ` ${printReceived(container.cloneNode(true))}`, + ` ${this.utils.printReceived(container.cloneNode(true))}`, ].join('\n') }, } diff --git a/src/to-have-attribute.js b/src/to-have-attribute.js index bd56d7cd..d2a0de92 100644 --- a/src/to-have-attribute.js +++ b/src/to-have-attribute.js @@ -1,11 +1,10 @@ -import {matcherHint, stringify, printExpected} from 'jest-matcher-utils' import {checkHtmlElement, getMessage} from './utils' -function printAttribute(name, value) { +function printAttribute(stringify, name, value) { return value === undefined ? name : `${name}=${stringify(value)}` } -function getAttributeComment(name, value) { +function getAttributeComment(stringify, name, value) { return value === undefined ? `element.hasAttribute(${stringify(name)})` : `element.getAttribute(${stringify(name)}) === ${stringify(value)}` @@ -23,23 +22,28 @@ export function toHaveAttribute(htmlElement, name, expectedValue) { message: () => { const to = this.isNot ? 'not to' : 'to' const receivedAttribute = hasAttribute - ? printAttribute(name, receivedValue) + ? printAttribute(this.utils.stringify, name, receivedValue) : null - const matcher = matcherHint( + const matcher = this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveAttribute`, 'element', - printExpected(name), + this.utils.printExpected(name), { secondArgument: isExpectedValuePresent - ? printExpected(expectedValue) + ? this.utils.printExpected(expectedValue) : undefined, - comment: getAttributeComment(name, expectedValue), + comment: getAttributeComment( + this.utils.stringify, + name, + expectedValue, + ), }, ) return getMessage( + this, matcher, `Expected the element ${to} have attribute`, - printAttribute(name, expectedValue), + printAttribute(this.utils.stringify, name, expectedValue), 'Received', receivedAttribute, ) diff --git a/src/to-have-class.js b/src/to-have-class.js index 99b58892..b9ff0fee 100644 --- a/src/to-have-class.js +++ b/src/to-have-class.js @@ -1,4 +1,3 @@ -import {matcherHint, printExpected} from 'jest-matcher-utils' import {checkHtmlElement, getMessage} from './utils' function getExpectedClassNamesAndOptions(params) { @@ -10,7 +9,7 @@ function getExpectedClassNamesAndOptions(params) { options = lastParam } else { expectedClassNames = params.concat(lastParam) - options = { exact: false } + options = {exact: false} } return {expectedClassNames, options} } @@ -42,6 +41,7 @@ export function toHaveClass(htmlElement, ...params) { message: () => { const to = this.isNot ? 'not to' : 'to' return getMessage( + this, `Expected the element ${to} have EXACTLY defined classes`, expected.join(' '), 'Received', @@ -57,10 +57,11 @@ export function toHaveClass(htmlElement, ...params) { message: () => { const to = this.isNot ? 'not to' : 'to' return getMessage( - matcherHint( + this, + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveClass`, 'element', - printExpected(expected.join(' ')), + this.utils.printExpected(expected.join(' ')), ), `Expected the element ${to} have class`, expected.join(' '), @@ -74,14 +75,15 @@ export function toHaveClass(htmlElement, ...params) { message: () => this.isNot ? getMessage( - matcherHint('.not.toHaveClass', 'element', ''), + this, + this.utils.matcherHint('.not.toHaveClass', 'element', ''), 'Expected the element to have classes', '(none)', 'Received', received.join(' '), ) : [ - matcherHint(`.toHaveClass`, 'element'), + this.utils.matcherHint(`.toHaveClass`, 'element'), 'At least one expected class must be provided.', ].join('\n'), } diff --git a/src/to-have-description.js b/src/to-have-description.js index 1f1f769b..61419dc7 100644 --- a/src/to-have-description.js +++ b/src/to-have-description.js @@ -1,4 +1,3 @@ -import {matcherHint, printExpected, printReceived} from 'jest-matcher-utils' import {checkHtmlElement, getMessage, normalize} from './utils' // See algoritm: https://www.w3.org/TR/accname-1.1/#mapping_additional_nd_description @@ -27,15 +26,16 @@ export function toHaveDescription(htmlElement, checkWith) { message: () => { const to = this.isNot ? 'not to' : 'to' return getMessage( - matcherHint( + this, + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveDescription`, 'element', '', ), `Expected the element ${to} have description`, - printExpected(checkWith), + this.utils.printExpected(checkWith), 'Received', - printReceived(description), + this.utils.printReceived(description), ) }, } diff --git a/src/to-have-display-value.js b/src/to-have-display-value.js index 11d35c5c..bdfd2c78 100644 --- a/src/to-have-display-value.js +++ b/src/to-have-display-value.js @@ -1,4 +1,3 @@ -import {matcherHint} from 'jest-matcher-utils' import {matches, checkHtmlElement, getMessage} from './utils' export function toHaveDisplayValue(htmlElement, expectedValue) { @@ -32,7 +31,8 @@ export function toHaveDisplayValue(htmlElement, expectedValue) { pass: matchedWithAllValues && matchedWithAllExpectedValues, message: () => getMessage( - matcherHint( + this, + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveDisplayValue`, 'element', '', diff --git a/src/to-have-focus.js b/src/to-have-focus.js index 0d653d44..8d4eefdc 100644 --- a/src/to-have-focus.js +++ b/src/to-have-focus.js @@ -1,4 +1,3 @@ -import {matcherHint, printReceived, printExpected} from 'jest-matcher-utils' import {checkHtmlElement} from './utils' export function toHaveFocus(element) { @@ -8,12 +7,16 @@ export function toHaveFocus(element) { pass: element.ownerDocument.activeElement === element, message: () => { return [ - matcherHint(`${this.isNot ? '.not' : ''}.toHaveFocus`, 'element', ''), + this.utils.matcherHint( + `${this.isNot ? '.not' : ''}.toHaveFocus`, + 'element', + '', + ), '', 'Expected', - ` ${printExpected(element)}`, + ` ${this.utils.printExpected(element)}`, 'Received:', - ` ${printReceived(element.ownerDocument.activeElement)}`, + ` ${this.utils.printReceived(element.ownerDocument.activeElement)}`, ].join('\n') }, } diff --git a/src/to-have-form-values.js b/src/to-have-form-values.js index 0a571fd2..c3fddcc0 100644 --- a/src/to-have-form-values.js +++ b/src/to-have-form-values.js @@ -1,5 +1,3 @@ -import {matcherHint} from 'jest-matcher-utils' -import jestDiff from 'jest-diff' import isEqualWith from 'lodash/isEqualWith' import uniq from 'lodash/uniq' import escape from 'css.escape' @@ -81,9 +79,9 @@ export function toHaveFormValues(formElement, expectedValues) { .filter(key => expectedValues.hasOwnProperty(key)) .reduce((obj, key) => ({...obj, [key]: formValues[key]}), {}) return [ - matcherHint(matcher, 'element', ''), + this.utils.matcherHint(matcher, 'element', ''), `Expected the element ${to} have form values`, - jestDiff(expectedValues, commonKeyValues), + this.utils.diff(expectedValues, commonKeyValues), ].join('\n\n') }, } diff --git a/src/to-have-style.js b/src/to-have-style.js index 7926827b..f125450c 100644 --- a/src/to-have-style.js +++ b/src/to-have-style.js @@ -1,5 +1,3 @@ -import {matcherHint} from 'jest-matcher-utils' -import jestDiff from 'jest-diff' import chalk from 'chalk' import {checkHtmlElement, parseCSS} from './utils' @@ -36,7 +34,7 @@ function printoutStyles(styles) { // Highlights only style rules that were expected but were not found in the // received computed styles -function expectedDiff(expected, computedStyles) { +function expectedDiff(diffFn, expected, computedStyles) { const received = Array.from(computedStyles) .filter(prop => expected[prop] !== undefined) .reduce( @@ -44,10 +42,7 @@ function expectedDiff(expected, computedStyles) { Object.assign(obj, {[prop]: computedStyles.getPropertyValue(prop)}), {}, ) - const diffOutput = jestDiff( - printoutStyles(expected), - printoutStyles(received), - ) + const diffOutput = diffFn(printoutStyles(expected), printoutStyles(received)) // Remove the "+ Received" annotation because this is a one-way diff return diffOutput.replace(`${chalk.red('+ Received')}\n`, '') } @@ -66,8 +61,8 @@ export function toHaveStyle(htmlElement, css) { message: () => { const matcher = `${this.isNot ? '.not' : ''}.toHaveStyle` return [ - matcherHint(matcher, 'element', ''), - expectedDiff(expected, received), + this.utils.matcherHint(matcher, 'element', ''), + expectedDiff(this.utils.diff, expected, received), ].join('\n\n') }, } diff --git a/src/to-have-text-content.js b/src/to-have-text-content.js index 1b07909b..05994bfc 100644 --- a/src/to-have-text-content.js +++ b/src/to-have-text-content.js @@ -1,4 +1,3 @@ -import {matcherHint} from 'jest-matcher-utils' import {checkHtmlElement, getMessage, matches, normalize} from './utils' export function toHaveTextContent( @@ -19,7 +18,8 @@ export function toHaveTextContent( message: () => { const to = this.isNot ? 'not to' : 'to' return getMessage( - matcherHint( + this, + this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveTextContent`, 'element', '', diff --git a/src/to-have-value.js b/src/to-have-value.js index fa1a101f..0b24e165 100644 --- a/src/to-have-value.js +++ b/src/to-have-value.js @@ -1,4 +1,3 @@ -import {matcherHint} from 'jest-matcher-utils' import isEqualWith from 'lodash/isEqualWith' import { checkHtmlElement, @@ -35,12 +34,13 @@ export function toHaveValue(htmlElement, expectedValue) { : Boolean(receivedValue), message: () => { const to = this.isNot ? 'not to' : 'to' - const matcher = matcherHint( + const matcher = this.utils.matcherHint( `${this.isNot ? '.not' : ''}.toHaveValue`, 'element', expectedValue, ) return getMessage( + this, matcher, `Expected the element ${to} have value`, expectsValue ? expectedTypedValue : '(any)', diff --git a/src/utils.js b/src/utils.js index b19c581f..095244ec 100644 --- a/src/utils.js +++ b/src/utils.js @@ -1,12 +1,4 @@ import redent from 'redent' -import { - RECEIVED_COLOR as receivedColor, - EXPECTED_COLOR as expectedColor, - matcherHint, - printWithType, - printReceived, - stringify, -} from 'jest-matcher-utils' import {parse} from 'css' import isEqual from 'lodash/isEqual' @@ -20,19 +12,24 @@ class HtmlElementTypeError extends Error { } let withType = '' try { - withType = printWithType('Received', received, printReceived) + withType = context.utils.printWithType( + 'Received', + received, + context.utils.printReceived, + ) } catch (e) { // Can throw for Document: // https://github.com/jsdom/jsdom/issues/2304 } this.message = [ - matcherHint( + context.utils.matcherHint( `${context.isNot ? '.not' : ''}.${matcherFn.name}`, 'received', '', ), '', - `${receivedColor( + // eslint-disable-next-line babel/new-cap + `${context.utils.RECEIVED_COLOR( 'received', )} value must be an HTMLElement or an SVGElement.`, withType, @@ -63,7 +60,7 @@ function checkHtmlElement(htmlElement, ...args) { } class InvalidCSSError extends Error { - constructor(received, matcherFn) { + constructor(received, matcherFn, context) { super() /* istanbul ignore next */ @@ -73,8 +70,10 @@ class InvalidCSSError extends Error { this.message = [ received.message, '', - receivedColor(`Failing css:`), - receivedColor(`${received.css}`), + // eslint-disable-next-line babel/new-cap + context.utils.RECEIVED_COLOR(`Failing css:`), + // eslint-disable-next-line babel/new-cap + context.utils.RECEIVED_COLOR(`${received.css}`), ].join('\n') } } @@ -103,11 +102,12 @@ function parseCSS(css, ...args) { return parsedRules } -function display(value) { - return typeof value === 'string' ? value : stringify(value) +function display(context, value) { + return typeof value === 'string' ? value : context.utils.stringify(value) } function getMessage( + context, matcher, expectedLabel, expectedValue, @@ -116,8 +116,14 @@ function getMessage( ) { return [ `${matcher}\n`, - `${expectedLabel}:\n${expectedColor(redent(display(expectedValue), 2))}`, - `${receivedLabel}:\n${receivedColor(redent(display(receivedValue), 2))}`, + // eslint-disable-next-line babel/new-cap + `${expectedLabel}:\n${context.utils.EXPECTED_COLOR( + redent(display(context, expectedValue), 2), + )}`, + // eslint-disable-next-line babel/new-cap + `${receivedLabel}:\n${context.utils.RECEIVED_COLOR( + redent(display(context, receivedValue), 2), + )}`, ].join('\n') }