(core) Editing summary columns widget options

Summary:
- Allowing changing description and all widget options (except choices) for summary columns
- Making text error in toast notification selectable

Test Plan: Added new tests

Reviewers: georgegevoian

Reviewed By: georgegevoian

Subscribers: georgegevoian

Differential Revision: https://phab.getgrist.com/D4346

test/nbrowser/DescriptionColumn.ts

@@ -9,11 +9,38 @@ describe('DescriptionColumn', function() {
   let session: gu.Session;
 
   before(async () => {
-    session = await gu.session().teamSite.login();
+    session = await gu.session().login();
+    await session.tempNewDoc(cleanup);
+  });
+
+  it('should allow to edit description on summary table', async () => {
+    await gu.toggleSidePanel('left', 'close');
+    // Add summary table.
+    await gu.addNewSection('Table', 'Table1', {summarize: ['A']});
+    await gu.sendActions([
+      ['AddRecord', 'Table1', null, {A: 1}],
+    ]);
+
+    // Set description on A column and count column.
+    await gu.openColumnPanel('A');
+    await getDescriptionInput().sendKeys('testA');
+    await gu.openColumnPanel('count');
+    await gu.waitForServer();
+    await gu.checkForErrors();
+    await getDescriptionInput().sendKeys('testCount');
+    await gu.openColumnPanel('A');
+    await gu.waitForServer();
+    await gu.checkForErrors();
+
+    await gu.reloadDoc();
+    await gu.openColumnPanel('A');
+    assert.equal(await getDescriptionInput().getAttribute('value'), 'testA');
+    await gu.openColumnPanel('count');
+    assert.equal(await getDescriptionInput().getAttribute('value'), 'testCount');
+    await gu.undo(4);
   });
 
   it('should switch between close and save', async () => {
-    await session.tempNewDoc(cleanup);
     // Add new column.
     await addColumn();
 
@@ -100,7 +127,6 @@ describe('DescriptionColumn', function() {
     assert.isFalse(await gu.getColumnHeader({col: 'D'}).isPresent());
   });
 
-
   it('shows links in the column description', async () => {
     const revert = await gu.begin();
 

test/nbrowser/HeaderColor.ts

@@ -5,22 +5,50 @@ import { setupTestSuite } from 'test/nbrowser/testUtils';
 const defaultHeaderBackgroundColor = '#f7f7f7';
 
 describe('HeaderColor', function () {
-  this.timeout(20000);
+  this.timeout('20s');
   const cleanup = setupTestSuite();
 
   before(async () => {
     // Create a new document
     const mainSession = await gu.session().login();
     await mainSession.tempNewDoc(cleanup, 'HeaderColor');
+  });
+
+  it('allows setting header colors in summary table', async function () {
+    const revert = await gu.begin();
+    await gu.toggleSidePanel('left', 'close');
+    // Add summary table.
+    await gu.addNewSection('Table', 'Table1', {summarize: ['A']});
+    await gu.sendActions([
+      ['AddRecord', 'Table1', null, {A: 1}],
+    ]);
+    await gu.toggleSidePanel('right', 'open');
+    const testStyle = async () => {
+      await gu.openHeaderColorPicker();
+      await gu.setFillColor('red');
+      await gu.setTextColor('blue');
+      await gu.applyStyle();
+      await gu.checkForErrors();
+      await gu.assertHeaderFillColor(await gu.getSelectedColumn(), 'red');
+      await gu.assertHeaderTextColor(await gu.getSelectedColumn(), 'blue');
+    };
+    await gu.openColumnPanel('A');
+    await testStyle();
+    await gu.openColumnPanel('count');
+    await testStyle();
+
+    await gu.waitForServer();
+    await revert();
+  });
+
+  it('should save by clicking away', async function () {
     // add records
     await gu.enterCell('a');
     await gu.enterCell('b');
     await gu.enterCell('c');
     await gu.toggleSidePanel('right', 'open');
     await driver.find('.test-right-tab-field').click();
-  });
 
-  it('should save by clicking away', async function () {
     await gu.getCell('A', 1).click();
     // open color picker
     await gu.openHeaderColorPicker();

test/nbrowser/gristUtils.ts

@@ -563,6 +563,10 @@ export function getColumnHeader(colOrColOptions: string|IColHeader): WebElementP
     sectionElem.findContent('.column_name .kf_elabel_text', exactMatch(col)).findClosest('.column_name'));
 }
 
+export function getSelectedColumn() {
+  return driver.find('.active_section .column_name.selected');
+}
+
 export async function getColumnNames() {
   const section = await driver.findWait('.active_section', 4000);
   return (await section.findAll('.column_name', el => el.getText()))
@@ -2439,6 +2443,11 @@ export function setFillColor(color: string) {
   return setColor(driver.find('.test-fill-input'), color);
 }
 
+export async function applyStyle() {
+  await driver.find('.test-colors-save').click();
+  await waitForServer();
+}
+
 export function getStyleRuleAt(nr: number) {
   return driver.find(`.test-widget-style-conditional-rule-${nr}`);
 }
@@ -2482,14 +2491,17 @@ export function openHeaderColorPicker() {
   return driver.find('.test-header-color-select .test-color-select').click();
 }
 
-export async function assertHeaderTextColor(col: string, color: string) {
-  await assertTextColor(await getColumnHeader(col), color);
+export async function assertHeaderTextColor(col: string|WebElement, color: string) {
+  const element = typeof col === 'string' ? await getColumnHeader(col) : col;
+  await assertTextColor(element, color);
 }
 
-export async function assertHeaderFillColor(col: string, color: string) {
-  await assertFillColor(await getColumnHeader(col), color);
+export async function assertHeaderFillColor(col: string|WebElement, color: string) {
+  const element = typeof col === 'string' ? await getColumnHeader(col) : col;
+  await assertFillColor(element, color);
 }
 
+
 /**
  * Opens a cell color picker, either the default one or the one for a specific style rule.
  */