diff --git a/src/__tests__/__snapshots__/render-debug.test.tsx.snap b/src/__tests__/__snapshots__/render-debug.test.tsx.snap index 25106295..8e3c1077 100644 --- a/src/__tests__/__snapshots__/render-debug.test.tsx.snap +++ b/src/__tests__/__snapshots__/render-debug.test.tsx.snap @@ -367,106 +367,6 @@ exports[`debug: another custom message 1`] = ` " `; -exports[`debug: shallow 1`] = ` -" - - Is the banana fresh? - - - not fresh - - - - - - - Change freshness! - - - First Text - - - Second Text - - - 0 - -" -`; - -exports[`debug: shallow with message 1`] = ` -"my other custom message - - - - Is the banana fresh? - - - not fresh - - - - - - - Change freshness! - - - First Text - - - Second Text - - - 0 - -" -`; - exports[`debug: with message 1`] = ` "my custom message diff --git a/src/__tests__/render-debug.test.tsx b/src/__tests__/render-debug.test.tsx index 9a57c814..0b5bd462 100644 --- a/src/__tests__/render-debug.test.tsx +++ b/src/__tests__/render-debug.test.tsx @@ -97,21 +97,19 @@ test('debug', () => { screen.debug(); screen.debug('my custom message'); - screen.debug.shallow(); - screen.debug.shallow('my other custom message'); screen.debug({ message: 'another custom message' }); const mockCalls = jest.mocked(console.log).mock.calls; expect(stripAnsi(mockCalls[0][0])).toMatchSnapshot(); expect(stripAnsi(mockCalls[1][0] + mockCalls[1][1])).toMatchSnapshot('with message'); - expect(stripAnsi(mockCalls[2][0])).toMatchSnapshot('shallow'); - expect(stripAnsi(mockCalls[3][0] + mockCalls[3][1])).toMatchSnapshot('shallow with message'); - expect(stripAnsi(mockCalls[4][0] + mockCalls[4][1])).toMatchSnapshot('another custom message'); + expect(stripAnsi(mockCalls[2][0] + mockCalls[2][1])).toMatchSnapshot('another custom message'); const mockWarnCalls = jest.mocked(console.warn).mock.calls; - expect(mockWarnCalls[0]).toEqual([ - 'Using debug("message") is deprecated and will be removed in future release, please use debug({ message; "message" }) instead.', - ]); + expect(mockWarnCalls[0]).toMatchInlineSnapshot(` + [ + "Using debug("message") is deprecated and will be removed in future release, please use debug({ message: "message" }) instead.", + ] + `); }); test('debug changing component', () => { diff --git a/src/__tests__/screen.test.tsx b/src/__tests__/screen.test.tsx index b22e9252..d5e5183c 100644 --- a/src/__tests__/screen.test.tsx +++ b/src/__tests__/screen.test.tsx @@ -55,6 +55,5 @@ test('screen throws without render', () => { expect(() => screen.root).toThrow('`render` method has not been called'); expect(() => screen.UNSAFE_root).toThrow('`render` method has not been called'); expect(() => screen.debug()).toThrow('`render` method has not been called'); - expect(() => screen.debug.shallow()).toThrow('`render` method has not been called'); expect(() => screen.getByText('Mt. Everest')).toThrow('`render` method has not been called'); }); diff --git a/src/config.ts b/src/config.ts index fd867a89..78e63977 100644 --- a/src/config.ts +++ b/src/config.ts @@ -1,4 +1,4 @@ -import { DebugOptions } from './helpers/debug-deep'; +import { DebugOptions } from './helpers/debug'; /** * Global configuration options for React Native Testing Library. diff --git a/src/helpers/debug-shallow.ts b/src/helpers/debug-shallow.ts deleted file mode 100644 index 510a1f40..00000000 --- a/src/helpers/debug-shallow.ts +++ /dev/null @@ -1,22 +0,0 @@ -import * as React from 'react'; -import type { ReactTestInstance } from 'react-test-renderer'; -import { shallowInternal } from '../shallow'; -import format from './format'; - -/** - * Log pretty-printed shallow test component instance - */ -export default function debugShallow( - instance: ReactTestInstance | React.ReactElement, - message?: string, -) { - const { output } = shallowInternal(instance); - - if (message) { - // eslint-disable-next-line no-console - console.log(`${message}\n\n`, format(output)); - } else { - // eslint-disable-next-line no-console - console.log(format(output)); - } -} diff --git a/src/helpers/debug-deep.ts b/src/helpers/debug.ts similarity index 95% rename from src/helpers/debug-deep.ts rename to src/helpers/debug.ts index 0450330e..14ced11a 100644 --- a/src/helpers/debug-deep.ts +++ b/src/helpers/debug.ts @@ -8,7 +8,7 @@ export type DebugOptions = { /** * Log pretty-printed deep test component instance */ -export default function debugDeep( +export function debug( instance: ReactTestRendererJSON | ReactTestRendererJSON[], options?: DebugOptions | string, ) { diff --git a/src/render.tsx b/src/render.tsx index a73addbe..fbfb3342 100644 --- a/src/render.tsx +++ b/src/render.tsx @@ -5,8 +5,7 @@ import act from './act'; import { addToCleanupQueue } from './cleanup'; import { getConfig } from './config'; import { getHostChildren } from './helpers/component-tree'; -import debugDeep, { DebugOptions } from './helpers/debug-deep'; -import debugShallow from './helpers/debug-shallow'; +import { debug, DebugOptions } from './helpers/debug'; import { configureHostComponentNamesIfNeeded } from './helpers/host-component-names'; import { validateStringsRenderedWithinText } from './helpers/string-validation'; import { renderWithAct } from './render-act'; @@ -105,7 +104,7 @@ function buildRenderResult( unmount, rerender: update, // alias for `update` toJSON: renderer.toJSON, - debug: debug(instance, renderer), + debug: makeDebug(instance, renderer), get root(): ReactTestInstance { return getHostChildren(instance)[0]; }, @@ -139,12 +138,9 @@ function updateWithAct( }; } -export interface DebugFunction { - (options?: DebugOptions | string): void; - shallow: (message?: string) => void; -} +export type DebugFunction = (options?: DebugOptions | string) => void; -function debug(instance: ReactTestInstance, renderer: ReactTestRenderer): DebugFunction { +function makeDebug(instance: ReactTestInstance, renderer: ReactTestRenderer): DebugFunction { function debugImpl(options?: DebugOptions | string) { const { defaultDebugOptions } = getConfig(); const debugOptions = @@ -155,15 +151,14 @@ function debug(instance: ReactTestInstance, renderer: ReactTestRenderer): DebugF if (typeof options === 'string') { // eslint-disable-next-line no-console console.warn( - 'Using debug("message") is deprecated and will be removed in future release, please use debug({ message; "message" }) instead.', + 'Using debug("message") is deprecated and will be removed in future release, please use debug({ message: "message" }) instead.', ); } const json = renderer.toJSON(); if (json) { - return debugDeep(json, debugOptions); + return debug(json, debugOptions); } } - debugImpl.shallow = (message?: string) => debugShallow(instance, message); return debugImpl; } diff --git a/src/screen.ts b/src/screen.ts index 90600ef8..2d85d7c3 100644 --- a/src/screen.ts +++ b/src/screen.ts @@ -10,7 +10,6 @@ const notImplemented = () => { const notImplementedDebug = () => { throw new Error(SCREEN_ERROR); }; -notImplementedDebug.shallow = notImplemented; interface Screen extends RenderResult { isDetached?: boolean; diff --git a/src/shallow.ts b/src/shallow.ts deleted file mode 100644 index 90e030ff..00000000 --- a/src/shallow.ts +++ /dev/null @@ -1,18 +0,0 @@ -import * as React from 'react'; -import { ReactTestInstance } from 'react-test-renderer'; -import ShallowRenderer from 'react-test-renderer/shallow'; // eslint-disable-line import/no-extraneous-dependencies - -/** - * Renders test component shallowly using react-test-renderer/shallow - */ -export function shallowInternal(instance: ReactTestInstance | React.ReactElement): { - output: any; -} { - const renderer = new (ShallowRenderer as any)(); - - renderer.render(React.createElement(instance.type, instance.props)); - - return { - output: renderer.getRenderOutput(), - }; -} diff --git a/typings/index.flow.js b/typings/index.flow.js index 2bea0c77..df25313d 100644 --- a/typings/index.flow.js +++ b/typings/index.flow.js @@ -276,7 +276,6 @@ type DebugOptions = { type Debug = { (options?: DebugOptions | string): void, - shallow: (message?: string) => void, }; type Queries = ByTextQueries & diff --git a/website/docs/MigrationV13.md b/website/docs/MigrationV13.md index 285c801a..c2ae1493 100644 --- a/website/docs/MigrationV13.md +++ b/website/docs/MigrationV13.md @@ -1,5 +1,3 @@ -## @@ -0,0 +1,20 @@ - id: migration-v13 title: Migration to 13.0 @@ -62,6 +60,10 @@ const view = screen.getBy*(...); // Find the element using any query: *ByRole, * expect(view).toHaveAccessibilityValue({ now: 50, min: 0, max: 50 }); // Assert its accessibility value ``` +## Removed `debug.shallow` + +For a time being we didn't support shallow rendering. Now we are removing the last remains of it: `debug.shallow()`. If you are interested in shallow rendering see [here](migration-v2#removed-global-shallow-function). + # Other changes ## Updated `flushMicroTasks` internal method