diff --git a/app/client/components/ColumnTransform.ts b/app/client/components/ColumnTransform.ts index 772dbc41..e695f45d 100644 --- a/app/client/components/ColumnTransform.ts +++ b/app/client/components/ColumnTransform.ts @@ -10,6 +10,7 @@ import {ViewFieldRec} from 'app/client/models/entities/ViewFieldRec'; import {TableData} from 'app/client/models/TableData'; import {FieldBuilder} from 'app/client/widgets/FieldBuilder'; import {UserAction} from 'app/common/DocActions'; +import {GristObjCode} from 'app/plugin/GristData'; import {Disposable, Observable} from 'grainjs'; import isPlainObject from 'lodash/isPlainObject'; import * as ko from 'knockout'; @@ -34,6 +35,7 @@ export class ColumnTransform extends Disposable { protected editor: AceEditor|null = null; // Created when the dom is built by extending classes protected formulaUpToDate = Observable.create(this, true); protected _tableData: TableData; + protected rules: [GristObjCode.List, ...number[]]|null; // Whether _doFinalize should execute the transform, or cancel it. protected _shouldExecute: boolean = false; @@ -53,6 +55,7 @@ export class ColumnTransform extends Disposable { this.origColumn = this.field.column(); this.origDisplayCol = this.field.displayColModel(); this.origWidgetOptions = this.field.widgetOptionsJson(); + this.rules = this.origColumn.rules(); this.isCallPending = _fieldBuilder.isCallPending; this._tableData = gristDoc.docData.getTable(this.origColumn.table().tableId())!; @@ -169,6 +172,14 @@ export class ColumnTransform extends Disposable { formula: this.getIdentityFormula(), ...(this.origWidgetOptions ? {widgetOptions: JSON.stringify(this.origWidgetOptions)} : {}), }]); + if (this.rules) { + // We are in bundle, it is safe to just send another action. + // NOTE: We could add rules with AddColumn action, but there are some optimizations that converts array values. + await this.gristDoc.docData.sendActions([ + ['UpdateRecord', '_grist_Tables_column', newColInfo.colRef, {rules: this.rules}] + ]); + } + return newColInfo.colRef; } diff --git a/app/client/widgets/FieldBuilder.ts b/app/client/widgets/FieldBuilder.ts index a4d77ac7..2f42c411 100644 --- a/app/client/widgets/FieldBuilder.ts +++ b/app/client/widgets/FieldBuilder.ts @@ -423,6 +423,7 @@ export class FieldBuilder extends Disposable { kf.checkButton(transformButton, dom('span.glyphicon.glyphicon-flash'), dom.testId("FieldBuilder_editTransform"), + testId('edit-transform'), kd.toggleClass('disabled', () => this._isTransformingType() || this.origColumn.isFormula() || this.origColumn.disableModifyBase()) ) diff --git a/test/nbrowser/gristUtils.ts b/test/nbrowser/gristUtils.ts index a1f060bb..63b3755e 100644 --- a/test/nbrowser/gristUtils.ts +++ b/test/nbrowser/gristUtils.ts @@ -2240,12 +2240,47 @@ export function setFillColor(color: string) { return setColor(driver.find('.test-fill-input'), color); } +export async function styleRulesCount() { + const rules = await driver.findAll('.test-widget-style-conditional-rule'); + return rules.length; +} + +export async function addInitialStyleRule() { + await driver.find('.test-widget-style-add-conditional-style').click(); + await waitForServer(); +} + +export async function removeStyleRuleAt(nr: number) { + await driver.find(`.test-widget-style-remove-rule-${nr}`).click(); + await waitForServer(); +} + +export async function addAnotherStyleRule() { + await driver.find('.test-widget-style-add-another-rule').click(); + await waitForServer(); +} + +export async function openStyleRuleFormula(nr: number) { + await driver + .findWait(`.test-widget-style-conditional-rule-${nr} .formula_field_sidepane`, 1000) + .click(); + await waitAppFocus(false); +} + export async function clickAway() { await driver.find(".test-notifier-menu-btn").click(); await driver.sendKeys(Key.ESCAPE); } -export function openColorPicker() { +/** + * Opens a color picker, either the default one or the one for a specific style rule. + */ +export function openColorPicker(nr?: number) { + if (nr !== undefined) { + return driver + .find(`.test-widget-style-conditional-rule-${nr} .test-color-select`) + .click(); + } return driver.find('.test-color-select').click(); }