diff --git a/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.js b/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.js
deleted file mode 100644
index 24dd074992b02..0000000000000
--- a/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.js
+++ /dev/null
@@ -1,65 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-describe('SqlLab query tabs', () => {
- beforeEach(() => {
- cy.login();
- cy.visit('/superset/sqllab');
- });
-
- it('allows you to create a tab', () => {
- cy.get('[data-test="sql-editor-tabs"]').then(tabList => {
- const initialTabCount = tabList.length;
- // add tab
- cy.get('[data-test="add-tab-icon"]').first().click();
- // wait until we find the new tab
- cy.get('[data-test="sql-editor-tabs"]')
- .children()
- .eq(0)
- .contains(`Untitled Query ${initialTabCount}`);
- cy.get('[data-test="sql-editor-tabs"]')
- .children()
- .eq(0)
- .contains(`Untitled Query ${initialTabCount + 1}`);
- });
- });
-
- it('allows you to close a tab', () => {
- cy.get('[data-test="sql-editor-tabs"]')
- .children()
- .then(tabListA => {
- const initialTabCount = tabListA.length;
-
- // open the tab dropdown to remove
- cy.get('[data-test="dropdown-toggle-button"]')
- .children()
- .first()
- .click({
- force: true,
- });
-
- // first item is close
- cy.get('[data-test="close-tab-menu-option"]').click();
-
- cy.get('[data-test="sql-editor-tabs"]').should(
- 'have.length',
- initialTabCount - 1,
- );
- });
- });
-});
diff --git a/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.ts b/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.ts
new file mode 100644
index 0000000000000..0e85664cb785a
--- /dev/null
+++ b/superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.ts
@@ -0,0 +1,60 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+describe('SqlLab query tabs', () => {
+ beforeEach(() => {
+ cy.login();
+ cy.visit('/superset/sqllab');
+ });
+
+ it('allows you to create and close a tab', () => {
+ const tablistSelector = '[data-test="sql-editor-tabs"] > [role="tablist"]';
+ const tabSelector = `${tablistSelector} [role="tab"]`;
+ cy.get(tabSelector).then(tabs => {
+ const initialTabCount = tabs.length;
+ const initialUntitledCount = Math.max(
+ 0,
+ ...tabs
+ .map((i, tabItem) =>
+ Number(tabItem.textContent?.match(/Untitled Query (\d+)/)?.[1]),
+ )
+ .toArray(),
+ );
+
+ // add two new tabs
+ cy.get('[data-test="add-tab-icon"]:visible:last').click();
+ cy.contains('[role="tab"]', `Untitled Query ${initialUntitledCount + 1}`);
+ cy.get(tabSelector).should('have.length', initialTabCount + 1);
+
+ cy.get('[data-test="add-tab-icon"]:visible:last').click();
+ cy.contains('[role="tab"]', `Untitled Query ${initialUntitledCount + 2}`);
+ cy.get(tabSelector).should('have.length', initialTabCount + 2);
+
+ // close the tabs
+ cy.get(`${tabSelector}:last [data-test="dropdown-trigger"]`).click({
+ force: true,
+ });
+ cy.get('[data-test="close-tab-menu-option"]').click();
+ cy.get(tabSelector).should('have.length', initialTabCount + 1);
+ cy.contains('[role="tab"]', `Untitled Query ${initialUntitledCount + 1}`);
+
+ cy.get(`${tablistSelector} [aria-label="remove"]:last`).click();
+ cy.get(tabSelector).should('have.length', initialTabCount);
+ });
+ });
+});
diff --git a/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx b/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
index 11c6fa8b6c097..8c20a493b0876 100644
--- a/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
+++ b/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
@@ -386,9 +386,7 @@ class TabbedSqlEditors extends React.PureComponent {
);
const tabHeader = (
-
-
-
+
{qe.title} {' '}
);
diff --git a/superset-frontend/src/components/Checkbox/Checkbox.tsx b/superset-frontend/src/components/Checkbox/Checkbox.tsx
index 3441d0fe8cc61..7162929a967f0 100644
--- a/superset-frontend/src/components/Checkbox/Checkbox.tsx
+++ b/superset-frontend/src/components/Checkbox/Checkbox.tsx
@@ -49,5 +49,3 @@ export default function Checkbox({ checked, onChange, style }: CheckboxProps) {
);
}
-
-export type { CheckboxProps };
diff --git a/superset-frontend/src/components/Dropdown/index.tsx b/superset-frontend/src/components/Dropdown/index.tsx
index fdfa9f945c6c2..e5d5f9f8526c5 100644
--- a/superset-frontend/src/components/Dropdown/index.tsx
+++ b/superset-frontend/src/components/Dropdown/index.tsx
@@ -72,7 +72,7 @@ export interface DropdownProps {
export const Dropdown = ({ overlay, ...rest }: DropdownProps) => (
-
+