fix(dashboard): Allow selecting text in cells in Table and PivotTable…

… without triggering cross filters (apache#23283)

superset-frontend/packages/superset-ui-core/src/utils/getSelectedText.ts

@@ -0,0 +1,19 @@
+/**
+ * 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.
+ */
+export const getSelectedText = () => window.getSelection()?.toString();

superset-frontend/packages/superset-ui-core/src/utils/index.ts

@@ -27,6 +27,7 @@ export { default as promiseTimeout } from './promiseTimeout';
 export { default as logging } from './logging';
 export { default as removeDuplicates } from './removeDuplicates';
 export { lruCache } from './lruCache';
+export { getSelectedText } from './getSelectedText';
 export * from './featureFlags';
 export * from './random';
 export * from './typedMemo';

superset-frontend/packages/superset-ui-core/test/utils/getSelectedText.test.ts

@@ -0,0 +1,34 @@
+/**
+ * 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.
+ */
+import { getSelectedText } from '@superset-ui/core';
+
+test('Returns null if Selection object is null', () => {
+ jest.spyOn(window, 'getSelection').mockImplementationOnce(() => null);
+ expect(getSelectedText()).toEqual(undefined);
+ jest.restoreAllMocks();
+});
+
+test('Returns selection text if Selection object is not null', () => {
+ jest
+ .spyOn(window, 'getSelection')
+ // @ts-ignore
+ .mockImplementationOnce(() => ({ toString: () => 'test string' }));
+ expect(getSelectedText()).toEqual('test string');
+ jest.restoreAllMocks();
+});

superset-frontend/plugins/plugin-chart-pivot-table/src/PivotTableChart.tsx

@@ -30,6 +30,7 @@ import {
  isAdhocColumn,
  BinaryQueryObjectFilterClause,
  t,
+ getSelectedText,
 } from '@superset-ui/core';
 import { PivotTable, sortAs, aggregatorTemplates } from './react-pivottable';
 import {
@@ -356,6 +357,11 @@ export default function PivotTableChart(props: PivotTableProps) {
  return;
  }
 
+ // allow selecting text in a cell
+ if (getSelectedText()) {
+ return;
+ }
+
  const isActiveFilterValue = (key: string, val: DataRecordValue) =>
  !!selectedFilters && selectedFilters[key]?.includes(val);
 

superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx

@@ -41,6 +41,7 @@ import {
  DTTM_ALIAS,
  ensureIsArray,
  GenericDataType,
+ getSelectedText,
  getTimeFormatterForGranularity,
  BinaryQueryObjectFilterClause,
  styled,
@@ -493,7 +494,12 @@ export default function TableChart<D extends DataRecord = DataRecord>(
  title: typeof value === 'number' ? String(value) : undefined,
  onClick:
  emitCrossFilters && !valueRange && !isMetric
- ? () => toggleFilter(key, value)
+ ? () => {
+ // allow selecting text in a cell
+ if (!getSelectedText()) {
+ toggleFilter(key, value);
+ }
+ }
  : undefined,
  onContextMenu: (e: MouseEvent) => {
  if (handleContextMenu) {