From f04b4e87fbebaf2911593c74c965e67a5eaf7de7 Mon Sep 17 00:00:00 2001
From: Ross Mabbett <92495987+rtexelm@users.noreply.github.com>
Date: Tue, 7 May 2024 19:12:55 -0400
Subject: [PATCH] refactor(superset-ui-core): Migrate FallbackComponent.test to
 RTL (#28359)

---
 .../components/FallbackComponent.test.tsx     | 66 ++++++++++---------
 1 file changed, 34 insertions(+), 32 deletions(-)

diff --git a/superset-frontend/packages/superset-ui-core/test/chart/components/FallbackComponent.test.tsx b/superset-frontend/packages/superset-ui-core/test/chart/components/FallbackComponent.test.tsx
index f5d2bf0df2e72..eadb552988ea9 100644
--- a/superset-frontend/packages/superset-ui-core/test/chart/components/FallbackComponent.test.tsx
+++ b/superset-frontend/packages/superset-ui-core/test/chart/components/FallbackComponent.test.tsx
@@ -18,42 +18,44 @@
  */
 
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { FallbackProps } from 'react-error-boundary';
+import { ThemeProvider, supersetTheme } from '../../../src/style';
+
 import FallbackComponent from '../../../src/chart/components/FallbackComponent';
 
-describe('FallbackComponent', () => {
-  const ERROR = new Error('CaffeineOverLoadException');
-  const STACK_TRACE = 'Error at line 1: x.drink(coffee)';
-
-  it('renders error and stack trace', () => {
-    const wrapper = shallow(
-      <FallbackComponent componentStack={STACK_TRACE} error={ERROR} />,
-    );
-    const messages = wrapper.find('code');
-    expect(messages).toHaveLength(2);
-    expect(messages.at(0).text()).toEqual('Error: CaffeineOverLoadException');
-    expect(messages.at(1).text()).toEqual('Error at line 1: x.drink(coffee)');
-  });
+const renderWithTheme = (props: FallbackProps) =>
+  render(
+    <ThemeProvider theme={supersetTheme}>
+      <FallbackComponent {...props} />
+    </ThemeProvider>,
+  );
 
-  it('renders error only', () => {
-    const wrapper = shallow(<FallbackComponent error={ERROR} />);
-    const messages = wrapper.find('code');
-    expect(messages).toHaveLength(1);
-    expect(messages.at(0).text()).toEqual('Error: CaffeineOverLoadException');
-  });
+const ERROR = new Error('CaffeineOverLoadException');
+const STACK_TRACE = 'Error at line 1: x.drink(coffee)';
 
-  it('renders stacktrace only', () => {
-    const wrapper = shallow(<FallbackComponent componentStack={STACK_TRACE} />);
-    const messages = wrapper.find('code');
-    expect(messages).toHaveLength(2);
-    expect(messages.at(0).text()).toEqual('Unknown Error');
-    expect(messages.at(1).text()).toEqual('Error at line 1: x.drink(coffee)');
+test('renders error and stack trace', () => {
+  const { getByText } = renderWithTheme({
+    componentStack: STACK_TRACE,
+    error: ERROR,
   });
+  expect(getByText('Error: CaffeineOverLoadException')).toBeInTheDocument();
+  expect(getByText('Error at line 1: x.drink(coffee)')).toBeInTheDocument();
+});
 
-  it('renders when nothing is given', () => {
-    const wrapper = shallow(<FallbackComponent />);
-    const messages = wrapper.find('code');
-    expect(messages).toHaveLength(1);
-    expect(messages.at(0).text()).toEqual('Unknown Error');
-  });
+test('renders error only', () => {
+  const { getByText } = renderWithTheme({ error: ERROR });
+  expect(getByText('Error: CaffeineOverLoadException')).toBeInTheDocument();
+});
+
+test('renders stacktrace only', () => {
+  const { getByText } = renderWithTheme({ componentStack: STACK_TRACE });
+  expect(getByText('Unknown Error')).toBeInTheDocument();
+  expect(getByText('Error at line 1: x.drink(coffee)')).toBeInTheDocument();
+});
+
+test('renders when nothing is given', () => {
+  const { getByText } = renderWithTheme({});
+  expect(getByText('Unknown Error')).toBeInTheDocument();
 });