This is an automated email from the ASF dual-hosted git repository.
rusackas pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 134cae07ae1 fix(ui): update stale Ant Design v6 internal class
selectors (#42146)
134cae07ae1 is described below
commit 134cae07ae1f8e81ca5a05c71d42d0ceb9dbac8e
Author: Joe Li <[email protected]>
AuthorDate: Fri Jul 24 13:31:45 2026 -0700
fix(ui): update stale Ant Design v6 internal class selectors (#42146)
Co-authored-by: Claude Opus 4.8 <[email protected]>
---
.../cypress-base/cypress/support/directories.ts | 14 +-
.../src/components/Modal/Modal.tsx | 4 +-
.../components/ProgressBar/ProgressBar.test.tsx | 22 +++-
.../src/components/ProgressBar/index.tsx | 4 +-
.../src/components/Select/AsyncSelect.tsx | 2 +-
.../src/components/Select/Select.tsx | 2 +-
.../src/components/Table/VirtualTable.tsx | 2 +-
.../src/components/Table/index.tsx | 2 +-
.../src/components/antdDomContract.test.tsx | 145 ++++++++++++++++++++-
.../generators/docs/docs-screenshots.spec.ts | 2 +-
.../generators/docs/screenshot-manifest.yaml | 16 +--
.../src/SqlLab/components/SqlEditor/index.tsx | 2 +-
.../Datasource/DatasourceModal/index.tsx | 2 +-
.../src/components/ImportModal/styles.ts | 2 +-
.../nativeFilters/ConfigModal/ModalFooter.tsx | 2 +-
.../nativeFilters/ConfigModal/SharedStyles.tsx | 2 +-
.../Footer/CancelConfirmationAlert.tsx | 2 +-
.../src/features/databases/DatabaseModal/styles.ts | 4 +-
.../src/features/groups/GroupListModal.tsx | 2 +-
.../src/features/roles/RoleFormItems.tsx | 2 +-
.../src/features/users/UserListModal.tsx | 4 +-
.../src/pages/ChartCreation/index.tsx | 9 +-
superset/utils/webdriver.py | 10 +-
23 files changed, 199 insertions(+), 59 deletions(-)
diff --git a/superset-frontend/cypress-base/cypress/support/directories.ts
b/superset-frontend/cypress-base/cypress/support/directories.ts
index cd403660bda..52933f23790 100644
--- a/superset-frontend/cypress-base/cypress/support/directories.ts
+++ b/superset-frontend/cypress-base/cypress/support/directories.ts
@@ -97,7 +97,7 @@ export const databasesPage = {
infoAlert: '.ant-alert',
serviceAccountInput: '[name="credentials_info"]',
connectionStep: {
- modal: '.ant-modal-content',
+ modal: '.ant-modal-container',
modalBody: '.ant-modal-body',
stepTitle: '.css-7x6kk > h4',
helperBottom: '.helper-bottom',
@@ -261,7 +261,7 @@ export const datasetsList = {
},
},
deleteDatasetModal: {
- modal: '.ant-modal-content',
+ modal: '.ant-modal-container',
deleteInput: dataTestLocator('delete-modal-input'),
deleteButton: dataTestLocator('modal-confirm-button'),
text: '.css-kxmt87',
@@ -474,7 +474,7 @@ export const exploreView = {
},
chartAreaItem: '.nv-legend-text',
viewQueryModal: {
- container: '.ant-modal-content',
+ container: '.ant-modal-container',
closeButton: 'button.ant-modal-close',
},
embedCodeModal: {
@@ -482,7 +482,7 @@ export const exploreView = {
textfield: dataTestLocator('embed-code-textarea'),
},
saveModal: {
- modal: '.ant-modal-content',
+ modal: '.ant-modal-container',
chartNameInput: dataTestLocator('new-chart-name'),
dashboardNameInput: '.ant-select-input',
addToDashboardInput: dataTestLocator(
@@ -578,7 +578,7 @@ export const exploreView = {
},
},
editDatasetModal: {
- container: '.ant-modal-content',
+ container: '.ant-modal-container',
datasetTabsContainer: dataTestLocator('edit-dataset-tabs'),
saveButton: dataTestLocator('datasource-modal-save'),
metricsTab: {
@@ -617,12 +617,12 @@ export const dashboardView = {
closeButton: dataTestLocator('close-button'),
},
saveModal: {
- modal: '.ant-modal-content',
+ modal: '.ant-modal-container',
dashboardNameInput: '.ant-input',
saveButton: dataTestLocator('modal-save-dashboard-button'),
},
dashboardProperties: {
- modal: '.ant-modal-content',
+ modal: '.ant-modal-container',
dashboardTitleInput: dataTestLocator('dashboard-title-input'),
modalButton: '[type="button"]',
},
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx
b/superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx
index 6c00d8884a5..34581940331 100644
--- a/superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx
@@ -84,7 +84,7 @@ export const StyledModal =
styled(BaseModal)<StyledModalProps>`
`
}
- .ant-modal-content {
+ .ant-modal-container {
background-color: ${theme.colorBgContainer};
display: flex;
flex-direction: column;
@@ -196,7 +196,7 @@ export const StyledModal =
styled(BaseModal)<StyledModalProps>`
height: 100%;
}
- .ant-modal-content {
+ .ant-modal-container {
height: 100%;
.ant-modal-body {
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/ProgressBar.test.tsx
b/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/ProgressBar.test.tsx
index db606c0ff64..8ad5eb4eb44 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/ProgressBar.test.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/ProgressBar.test.tsx
@@ -60,18 +60,26 @@ test('should render with success icon', () => {
expect(screen.getByLabelText('check-circle')).toBeInTheDocument();
});
+// The stripes are painted on antd's inner progress track, so assert the
+// computed style of that element — asserting the outer container would pass
+// whether or not the gradient ever reached the track.
+const getTrack = (container: HTMLElement) =>
+ container.querySelector('.ant-progress-track') as HTMLElement;
+
test('should render with stripes', () => {
const stripedProps = {
...mockedProps,
striped: true,
};
const { container } = render(<ProgressBar {...stripedProps} />);
- expect(container).toHaveStyle(
- `background-image: 'linear-gradient(
- 45deg,rgba(255, 255, 255, 0.15) 25%,
- transparent 25%, transparent 50%,
- rgba(255, 255, 255, 0.15) 50%,
- rgba(255, 255, 255, 0.15) 75%,
- transparent 75%, transparent) !important'`,
+ expect(getComputedStyle(getTrack(container)).backgroundImage).toContain(
+ 'linear-gradient(45deg',
+ );
+});
+
+test('should render without stripes by default', () => {
+ const { container } = render(<ProgressBar {...mockedProps} />);
+ expect(getComputedStyle(getTrack(container)).backgroundImage).not.toContain(
+ 'linear-gradient',
);
});
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/index.tsx
b/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/index.tsx
index f76879eb2c3..5a3acb47395 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/index.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/ProgressBar/index.tsx
@@ -29,10 +29,10 @@ const ProgressBar = styled(({ striped, ...props }:
ProgressBarProps) => (
<AntdProgress data-test="progress-bar" {...props} />
))`
position: static;
- .ant-progress-inner {
+ .ant-progress-rail {
position: static;
}
- .ant-progress-bg {
+ .ant-progress-track {
position: static;
${({ striped }) =>
striped &&
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/Select/AsyncSelect.tsx
b/superset-frontend/packages/superset-ui-core/src/components/Select/AsyncSelect.tsx
index f85a79eee2c..61bcbe80f03 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/Select/AsyncSelect.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/Select/AsyncSelect.tsx
@@ -857,7 +857,7 @@ const AsyncSelect = forwardRef(
getPopupContainer={
getPopupContainer ||
((triggerNode: HTMLElement) =>
- (triggerNode?.closest('.ant-modal-content') as HTMLElement) ||
+ (triggerNode?.closest('.ant-modal-container') as HTMLElement) ||
(triggerNode.parentNode as HTMLElement))
}
headerPosition={headerPosition}
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
index 374d4475ae4..181cc597d40 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
@@ -912,7 +912,7 @@ const Select = forwardRef(
getPopupContainer={
getPopupContainer ||
((triggerNode: HTMLElement) =>
- (triggerNode?.closest('.ant-modal-content') as HTMLElement) ||
+ (triggerNode?.closest('.ant-modal-container') as HTMLElement) ||
(triggerNode.parentNode as HTMLElement))
}
headerPosition={headerPosition}
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/Table/VirtualTable.tsx
b/superset-frontend/packages/superset-ui-core/src/components/Table/VirtualTable.tsx
index f5c6967b0e0..1d5ada1948b 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/Table/VirtualTable.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/Table/VirtualTable.tsx
@@ -61,7 +61,7 @@ const StyledTable = styled(AntTable)(
text-overflow: ellipsis;
}
- .ant-spin-nested-loading .ant-spin .ant-spin-dot {
+ .ant-spin .ant-spin-dot {
width: ${theme.sizeUnit * 12}px;
height: unset;
}
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/Table/index.tsx
b/superset-frontend/packages/superset-ui-core/src/components/Table/index.tsx
index 9a9ecea2f8d..e1533770713 100644
--- a/superset-frontend/packages/superset-ui-core/src/components/Table/index.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/components/Table/index.tsx
@@ -198,7 +198,7 @@ const StyledTable = styled(AntTable as FC<AntTableProps>)<{
height?: number }>(
scrollbar-color: ${theme.colorFillSecondary}
${theme.colorFillQuaternary};
}
- .ant-spin-nested-loading .ant-spin .ant-spin-dot {
+ .ant-spin .ant-spin-dot {
width: ${theme.sizeXXL}px;
height: unset;
}
diff --git
a/superset-frontend/packages/superset-ui-core/src/components/antdDomContract.test.tsx
b/superset-frontend/packages/superset-ui-core/src/components/antdDomContract.test.tsx
index 533df41b546..9f8a6759f5c 100644
---
a/superset-frontend/packages/superset-ui-core/src/components/antdDomContract.test.tsx
+++
b/superset-frontend/packages/superset-ui-core/src/components/antdDomContract.test.tsx
@@ -31,10 +31,22 @@
* the exact class names our CSS depends on, so a future antd bump that renames
* one fails here with a clear pointer instead of shipping a visual regression.
*/
-import { render } from '@superset-ui/core/spec';
-// eslint-disable-next-line no-restricted-imports
-import { Collapse, Modal, Popover, Steps, Tabs, Tag, Tooltip } from 'antd';
-import { Select } from './Select';
+import { render, screen, userEvent, waitFor } from '@superset-ui/core/spec';
+import {
+ // eslint-disable-next-line no-restricted-imports
+ Alert,
+ Collapse,
+ Modal,
+ Popover,
+ Progress,
+ Spin,
+ Steps,
+ Tabs,
+ Tag,
+ Tooltip,
+} from 'antd';
+import { Modal as SupersetModal } from './Modal';
+import { AsyncSelect, Select } from './Select';
const antClasses = (root: ParentNode): string[] => {
const classes = new Set<string>();
@@ -176,9 +188,17 @@ test('Steps classes (QueryStatusBar, ChartCreation, SQL
Lab loading detection)',
'ant-steps-item-icon',
'ant-steps-item-title',
'ant-steps-item-rail',
+ 'ant-steps-item-content',
]),
);
expect(classes).not.toContain('ant-steps-item-tail');
+ // antd 6 removed the nested `.ant-steps-item-description`; the description
text
+ // now renders directly inside `.ant-steps-item-content`. ChartCreation
styles
+ // the description by targeting `.ant-steps-item-content` for exactly this
reason.
+ expect(classes).not.toContain('ant-steps-item-description');
+ expect(container.querySelector('.ant-steps-item-content')).toHaveTextContent(
+ 'd',
+ );
});
test('Select suffix (arrow) class (plugin-chart-table page-size Select targets
it)', () => {
@@ -216,13 +236,126 @@ test('Collapse panel/body classes (Collapse.tsx,
VizTypeGallery, config modals)'
expect(classes).not.toContain('ant-collapse-content-box');
});
-test('Modal body class (many *.styles.ts modal overrides target it)', () => {
+test('Modal container + body classes (many *.styles.ts modal overrides target
them)', () => {
render(
<Modal open title="t">
body
</Modal>,
);
- expect(antClasses(document.body)).toContain('ant-modal-body');
+ const classes = antClasses(document.body);
+ // antd 6 renamed the modal content wrapper `.ant-modal-content` ->
+ // `.ant-modal-container`. Several `.styles.ts` overrides target it, and
Select /
+ // popup `getPopupContainer`/`.closest()` lookups anchor popups to it so
their
+ // menus stay clipped inside the modal. `-body`/`-close` are unchanged but
the
+ // report-screenshot error-modal flow in `webdriver.py` walks all three, so
pin
+ // the whole chain it depends on.
+ expect(classes).toEqual(
+ expect.arrayContaining([
+ 'ant-modal-container',
+ 'ant-modal-body',
+ 'ant-modal-close',
+ ]),
+ );
+ expect(classes).not.toContain('ant-modal-content');
+});
+
+test.each([
+ [
+ 'Select',
+ <Select
+ ariaLabel="in-modal"
+ options={[{ label: 'Alpha', value: 'a' }]}
+ key="sync"
+ />,
+ ],
+ [
+ 'AsyncSelect',
+ <AsyncSelect
+ ariaLabel="in-modal"
+ options={async () => ({
+ data: [{ label: 'Alpha', value: 'a' }],
+ totalCount: 1,
+ })}
+ key="async"
+ />,
+ ],
+])(
+ '%s popup mounts inside the enclosing modal container',
+ async (_name, select) => {
+ // Select/AsyncSelect anchor their popup with
+ // `triggerNode.closest('.ant-modal-container')` so the menu is clipped by
+ // the modal instead of escaping to <body> and scrolling away from its
+ // trigger. The class contract above only proves the class exists — this
+ // asserts the containment behaviour it exists for.
+ render(
+ <SupersetModal show title="t" onHide={() => {}}>
+ {select}
+ </SupersetModal>,
+ );
+ await userEvent.click(screen.getByRole('combobox'));
+ await screen.findByTitle('Alpha');
+
+ await waitFor(() => {
+ const popup = document.querySelector('.ant-select-dropdown');
+ expect(popup).not.toBeNull();
+ // Assert the *direct* parent, not just an ancestor: when the
`.closest()`
+ // lookup misses, the `triggerNode.parentNode` fallback still sits inside
+ // the modal, so an `ancestor` check passes either way and proves
nothing.
+ expect(popup?.parentElement).toHaveClass('ant-modal-container');
+ });
+ },
+);
+
+test('Progress rail/track classes (ProgressBar + DatabaseModal striped
overrides target them)', () => {
+ const { container } = render(<Progress percent={50} />);
+ const classes = antClasses(container);
+ // antd 6 renamed `.ant-progress-inner` -> `.ant-progress-rail` and
+ // `.ant-progress-bg` -> `.ant-progress-track`. ProgressBar's styled wrapper
+ // paints the striped gradient on the track; DatabaseModal sizes the rail.
+ expect(classes).toEqual(
+ expect.arrayContaining(['ant-progress-rail', 'ant-progress-track']),
+ );
+ expect(classes).not.toContain('ant-progress-inner');
+ expect(classes).not.toContain('ant-progress-bg');
+});
+
+test('Alert title/actions classes (ImportModal, DatabaseModal, SqlEditor,
native-filter overrides target them)', () => {
+ const { container } = render(
+ <Alert
+ type="info"
+ title="msg"
+ description="desc"
+ action={<span>x</span>}
+ />,
+ );
+ const classes = antClasses(container);
+ // antd 6 renamed `.ant-alert-message` -> `.ant-alert-title` and pluralised
the
+ // action slot `.ant-alert-action` -> `.ant-alert-actions`. Several
`.styles.ts`
+ // overrides and the SQL Lab / native-filter modal footers target these.
+ expect(classes).toEqual(
+ expect.arrayContaining(['ant-alert-title', 'ant-alert-actions']),
+ );
+ expect(classes).not.toContain('ant-alert-message');
+ expect(classes).not.toContain('ant-alert-action');
+});
+
+test('Spin nested structure (Table/VirtualTable spinner sizing overrides
target it)', () => {
+ const { container } = render(
+ <Spin spinning>
+ <div>content</div>
+ </Spin>,
+ );
+ const classes = antClasses(container);
+ // antd 6 dropped the `.ant-spin-nested-loading` wrapper: `.ant-spin` is now
the
+ // outer element and `.ant-spin-dot` lives beneath it. Table/VirtualTable
size the
+ // dot via `.ant-spin .ant-spin-dot`, so that descendant chain must hold.
+ expect(classes).toEqual(
+ expect.arrayContaining(['ant-spin', 'ant-spin-container', 'ant-spin-dot']),
+ );
+ expect(classes).not.toContain('ant-spin-nested-loading');
+ expect(
+ container.querySelector('.ant-spin-dot')?.closest('.ant-spin'),
+ ).not.toBeNull();
});
test('Tag keeps its v5 trailing margin (GlobalStyles parity rule)', () => {
diff --git
a/superset-frontend/playwright/generators/docs/docs-screenshots.spec.ts
b/superset-frontend/playwright/generators/docs/docs-screenshots.spec.ts
index ed029888c78..6828f494aab 100644
--- a/superset-frontend/playwright/generators/docs/docs-screenshots.spec.ts
+++ b/superset-frontend/playwright/generators/docs/docs-screenshots.spec.ts
@@ -506,7 +506,7 @@ test('save flow and first dashboard screenshots', async ({
page }) => {
await expect(saveButton).toBeVisible({ timeout: 10000 });
await saveButton.click();
- const modal = page.locator('.ant-modal-content').filter({
+ const modal = page.locator('.ant-modal-container').filter({
has: page.locator('[data-test="save-modal-body"]'),
});
await expect(modal).toBeVisible({ timeout: 10000 });
diff --git
a/superset-frontend/playwright/generators/docs/screenshot-manifest.yaml
b/superset-frontend/playwright/generators/docs/screenshot-manifest.yaml
index 1d10dd53034..f3279dfc958 100644
--- a/superset-frontend/playwright/generators/docs/screenshot-manifest.yaml
+++ b/superset-frontend/playwright/generators/docs/screenshot-manifest.yaml
@@ -45,7 +45,7 @@ images:
alt: ""
source_file: docs/using-superset/creating-your-first-dashboard.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/creating-your-first-dashboard";
image_url:
"https://superset.apache.org/img/tutorial/tutorial_03a_database_connection_string_link.png";
@@ -53,7 +53,7 @@ images:
alt: ""
source_file: docs/using-superset/creating-your-first-dashboard.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/creating-your-first-dashboard";
image_url:
"https://superset.apache.org/img/tutorial/tutorial_03b_connection_string_details.png";
@@ -61,7 +61,7 @@ images:
alt: ""
source_file: docs/using-superset/creating-your-first-dashboard.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/creating-your-first-dashboard";
image_url:
"https://superset.apache.org/img/tutorial/tutorial_09_add_new_table.png";
@@ -69,7 +69,7 @@ images:
alt: ""
source_file: docs/using-superset/creating-your-first-dashboard.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/creating-your-first-dashboard";
image_url:
"https://superset.apache.org/img/tutorial/tutorial_calculated_column.png";
@@ -93,7 +93,7 @@ images:
alt: ""
source_file: docs/using-superset/creating-your-first-dashboard.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/creating-your-first-dashboard";
image_url:
"https://superset.apache.org/img/tutorial/tutorial_explore_run.jpg";
@@ -141,7 +141,7 @@ images:
alt: ""
source_file: docs/using-superset/exploring-data.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/exploring-data";
image_url: "https://superset.apache.org/img/tutorial/annotation.png";
@@ -197,7 +197,7 @@ images:
alt: ""
source_file: docs/using-superset/exploring-data.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/exploring-data";
image_url: "https://superset.apache.org/img/tutorial/markdown.png";
@@ -261,7 +261,7 @@ images:
alt: ""
source_file: docs/using-superset/exploring-data.mdx
app_path: null
- selector: .ant-modal-content
+ selector: .ant-modal-container
- type: tutorial
page_url:
"https://superset.apache.org/user-docs/using-superset/exploring-data";
image_url:
"https://superset.apache.org/img/tutorial/select_dates_pivot_table.png";
diff --git a/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
b/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
index c85a79735d3..540b78c7382 100644
--- a/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
+++ b/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
@@ -902,7 +902,7 @@ const SqlEditor: FC<Props> = ({
css={css`
margin-bottom: ${theme.sizeUnit * 2}px;
padding-top: ${theme.sizeUnit * 4}px;
- .ant-alert-action {
+ .ant-alert-actions {
align-self: center;
}
`}
diff --git
a/superset-frontend/src/components/Datasource/DatasourceModal/index.tsx
b/superset-frontend/src/components/Datasource/DatasourceModal/index.tsx
index 10baece8995..01ef94229df 100644
--- a/superset-frontend/src/components/Datasource/DatasourceModal/index.tsx
+++ b/superset-frontend/src/components/Datasource/DatasourceModal/index.tsx
@@ -53,7 +53,7 @@ const StyledDatasourceModal = styled(Modal)`
top: ${TOP_MARGIN_VH}vh;
padding-bottom: 0;
- && .ant-modal-content {
+ && .ant-modal-container {
max-height: ${MODAL_HEIGHT_VH}vh;
margin-top: 0;
margin-bottom: 0;
diff --git a/superset-frontend/src/components/ImportModal/styles.ts
b/superset-frontend/src/components/ImportModal/styles.ts
index a63de41334a..6754249302e 100644
--- a/superset-frontend/src/components/ImportModal/styles.ts
+++ b/superset-frontend/src/components/ImportModal/styles.ts
@@ -22,7 +22,7 @@ import { css, SupersetTheme } from
'@apache-superset/core/theme';
export const antdWarningAlertStyles = (theme: SupersetTheme) => css`
margin: ${theme.sizeUnit * 4}px 0;
- .ant-alert-message {
+ .ant-alert-title {
margin: 0;
}
`;
diff --git
a/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/ModalFooter.tsx
b/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/ModalFooter.tsx
index 133918665a6..72172d36897 100644
---
a/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/ModalFooter.tsx
+++
b/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/ModalFooter.tsx
@@ -32,7 +32,7 @@ const StyledAlert = styled(Alert)`
text-align: left;
flex: 1;
- & .ant-alert-action {
+ & .ant-alert-actions {
align-self: center;
}
`;
diff --git
a/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/SharedStyles.tsx
b/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/SharedStyles.tsx
index 362be87bb87..1d7ac1b67c6 100644
---
a/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/SharedStyles.tsx
+++
b/superset-frontend/src/dashboard/components/nativeFilters/ConfigModal/SharedStyles.tsx
@@ -66,7 +66,7 @@ export const BaseModalWrapper =
styled(StyledModal)<BaseModalWrapperProps>`
.ant-modal-body {
flex: 1 1 auto;
}
- .ant-modal-content {
+ .ant-modal-container {
height: 100%;
}
`}
diff --git
a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/Footer/CancelConfirmationAlert.tsx
b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/Footer/CancelConfirmationAlert.tsx
index 4b2f7925ebf..93589532572 100644
---
a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/Footer/CancelConfirmationAlert.tsx
+++
b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/Footer/CancelConfirmationAlert.tsx
@@ -43,7 +43,7 @@ export function CancelConfirmationAlert({
css={{
textAlign: 'left',
flex: 1,
- '& .ant-alert-action': { alignSelf: 'center' },
+ '& .ant-alert-actions': { alignSelf: 'center' },
}}
description={children}
action={
diff --git a/superset-frontend/src/features/databases/DatabaseModal/styles.ts
b/superset-frontend/src/features/databases/DatabaseModal/styles.ts
index 2d735409544..8cbf0a18e91 100644
--- a/superset-frontend/src/features/databases/DatabaseModal/styles.ts
+++ b/superset-frontend/src/features/databases/DatabaseModal/styles.ts
@@ -158,7 +158,7 @@ export const antDErrorAlertStyles = (theme: SupersetTheme)
=> css`
export const antdWarningAlertStyles = (theme: SupersetTheme) => css`
margin: ${theme.sizeUnit * 4}px 0;
- .ant-alert-message {
+ .ant-alert-title {
margin: 0;
}
`;
@@ -535,7 +535,7 @@ export const StyledCatalogTable = styled.div`
export const StyledUploadWrapper = styled.div`
margin: ${({ theme }) => theme.sizeUnit * 4}px;
- .ant-progress-inner {
+ .ant-progress-rail {
display: none;
}
`;
diff --git a/superset-frontend/src/features/groups/GroupListModal.tsx
b/superset-frontend/src/features/groups/GroupListModal.tsx
index 659cd54222d..dbcedb5dab7 100644
--- a/superset-frontend/src/features/groups/GroupListModal.tsx
+++ b/superset-frontend/src/features/groups/GroupListModal.tsx
@@ -140,7 +140,7 @@ function GroupListModal({
value: role.id,
label: role.name,
}))}
- getPopupContainer={trigger => trigger.closest('.ant-modal-content')}
+ getPopupContainer={trigger =>
trigger.closest('.ant-modal-container')}
/>
</FormItem>
<FormItem name="users" label={t('Users')}>
diff --git a/superset-frontend/src/features/roles/RoleFormItems.tsx
b/superset-frontend/src/features/roles/RoleFormItems.tsx
index e5ecb42cca8..0c6dd866a77 100644
--- a/superset-frontend/src/features/roles/RoleFormItems.tsx
+++ b/superset-frontend/src/features/roles/RoleFormItems.tsx
@@ -60,7 +60,7 @@ export const PermissionsField = ({
placeholder={t('Select permissions')}
options={options}
loading={loading}
- getPopupContainer={trigger => trigger.closest('.ant-modal-content')}
+ getPopupContainer={trigger => trigger.closest('.ant-modal-container')}
data-test="permissions-select"
/>
</FormItem>
diff --git a/superset-frontend/src/features/users/UserListModal.tsx
b/superset-frontend/src/features/users/UserListModal.tsx
index 65f6e4efac3..ca398cb7ea7 100644
--- a/superset-frontend/src/features/users/UserListModal.tsx
+++ b/superset-frontend/src/features/users/UserListModal.tsx
@@ -202,7 +202,7 @@ function UserListModal({
label: role.name,
}))}
getPopupContainer={trigger =>
- trigger.closest('.ant-modal-content')
+ trigger.closest('.ant-modal-container')
}
/>
</FormItem>
@@ -221,7 +221,7 @@ function UserListModal({
label: group.name,
}))}
getPopupContainer={trigger =>
- trigger.closest('.ant-modal-content')
+ trigger.closest('.ant-modal-container')
}
/>
</FormItem>
diff --git a/superset-frontend/src/pages/ChartCreation/index.tsx
b/superset-frontend/src/pages/ChartCreation/index.tsx
index 2d77cea1994..6e1cc2dc07b 100644
--- a/superset-frontend/src/pages/ChartCreation/index.tsx
+++ b/superset-frontend/src/pages/ChartCreation/index.tsx
@@ -139,11 +139,10 @@ const StyledContainer = styled.div`
&&&& .ant-steps-item-content {
overflow: unset;
-
- .ant-steps-item-description {
- margin-top: ${theme.sizeUnit}px;
- padding-bottom: ${theme.sizeUnit}px;
- }
+ /* antd 6 removed .ant-steps-item-description; the description text is
now
+ rendered directly in .ant-steps-item-content. */
+ margin-top: ${theme.sizeUnit}px;
+ padding-bottom: ${theme.sizeUnit}px;
}
&&&& .ant-tooltip-open {
diff --git a/superset/utils/webdriver.py b/superset/utils/webdriver.py
index c437e0cd6bf..cfa9618ed2f 100644
--- a/superset/utils/webdriver.py
+++ b/superset/utils/webdriver.py
@@ -240,8 +240,8 @@ class WebDriverPlaywright(WebDriverProxy):
alert_div.get_by_role("button").click()
# wait for modal to show up
- page.locator(".ant-modal-content").wait_for(state="visible")
- err_msg_div = page.locator(".ant-modal-content
.ant-modal-body")
+ page.locator(".ant-modal-container").wait_for(state="visible")
+ err_msg_div = page.locator(".ant-modal-container
.ant-modal-body")
#
# # collect error message
error_messages.append(err_msg_div.text_content())
@@ -250,10 +250,10 @@ class WebDriverPlaywright(WebDriverProxy):
error_as_html = err_msg_div.inner_html().replace("'", "\\'")
#
# # close modal after collecting error messages
- page.locator(".ant-modal-content .ant-modal-close").click()
+ page.locator(".ant-modal-container .ant-modal-close").click()
#
# # wait until the modal becomes invisible
- page.locator(".ant-modal-content").wait_for(state="detached")
+ page.locator(".ant-modal-container").wait_for(state="detached")
try:
# Even if some errors can't be updated in the screenshot,
# keep all the errors in the server log and do not fail
the loop
@@ -759,7 +759,7 @@ class WebDriverSelenium(WebDriverProxy):
app.config["SCREENSHOT_WAIT_FOR_ERROR_MODAL_VISIBLE"],
).until(
EC.visibility_of_any_elements_located(
- (By.CLASS_NAME, "ant-modal-content")
+ (By.CLASS_NAME, "ant-modal-container")
)
)[0]
![https://superset.apache.org/img/tutorial/tutorial_03a_database_connection_string_link.png"](https://superset.apache.org/img/tutorial/tutorial_03a_database_connection_string_link.png"){kind=link}
![https://superset.apache.org/img/tutorial/tutorial_03b_connection_string_details.png"](https://superset.apache.org/img/tutorial/tutorial_03b_connection_string_details.png"){kind=link}
![https://superset.apache.org/img/tutorial/tutorial_09_add_new_table.png"](https://superset.apache.org/img/tutorial/tutorial_09_add_new_table.png"){kind=link}
![https://superset.apache.org/img/tutorial/tutorial_calculated_column.png"](https://superset.apache.org/img/tutorial/tutorial_calculated_column.png"){kind=link}
![https://superset.apache.org/img/tutorial/tutorial_explore_run.jpg"](https://superset.apache.org/img/tutorial/tutorial_explore_run.jpg"){kind=link}
![https://superset.apache.org/img/tutorial/annotation.png"](https://superset.apache.org/img/tutorial/annotation.png"){kind=link}
![https://superset.apache.org/img/tutorial/markdown.png"](https://superset.apache.org/img/tutorial/markdown.png"){kind=link}
![https://superset.apache.org/img/tutorial/select_dates_pivot_table.png"](https://superset.apache.org/img/tutorial/select_dates_pivot_table.png"){kind=link}