Summary: This adds a UI panel for managing webhooks. Work started by Cyprien Pindat. You can find the UI on a document's settings page. Main changes relative to Cyprien's demo: * Changed behavior of virtual table to be more consistent with the rest of Grist, by factoring out part of the implementation of on-demand tables. * Cell values that would create an error can now be denied and reverted (as for the rest of Grist). * Changes made by other users are integrated in a sane way. * Basic undo/redo support is added using the regular undo/redo stack. * The table list in the drop-down is now updated if schema changes. * Added a notification from back-end when webhook status is updated so constant polling isn't needed to support multi-user operation. * Factored out webhook specific logic from general virtual table support. * Made a bunch of fixes to various broken behavior. * Added tests. The code remains somewhat unpolished, and behavior in the presence of errors is imperfect in general but may be adequate for this case. I assume that we'll soon be lifting the restriction on the set of domains that are supported for webhooks - otherwise we'd want to provide some friendly way to discover that list of supported domains rather than just throwing an error. I don't actually know a lot about how the front-end works - it looks like tables/columns/fields/sections can be safely added if they have string ids that won't collide with bone fide numeric ids from the back end. Sneaky. Contains a migration, so needs an extra reviewer for that. Test Plan: added tests Reviewers: jarek, dsagal Reviewed By: jarek, dsagal Differential Revision: https://phab.getgrist.com/D3856pull/518/head
Paul Fitzpatrick
1 year ago
parent
5e9f2e06ea
commit
603238e966
@ -0,0 +1,242 @@
|
||||
import { reportError } from 'app/client/models/errors';
|
||||
import { GristDoc } from 'app/client/components/GristDoc';
|
||||
import { DocData } from 'app/client/models/DocData';
|
||||
import { TableData } from 'app/client/models/TableData';
|
||||
import { concatenateSummaries, summarizeStoredAndUndo } from 'app/common/ActionSummarizer';
|
||||
import { TableDelta } from 'app/common/ActionSummary';
|
||||
import { ProcessedAction } from 'app/common/AlternateActions';
|
||||
import { DisposableWithEvents } from 'app/common/DisposableWithEvents';
|
||||
import { DocAction, TableDataAction, UserAction } from 'app/common/DocActions';
|
||||
import { DocDataCache } from 'app/common/DocDataCache';
|
||||
import { ColTypeMap } from 'app/common/TableData';
|
||||
import { RowRecord } from 'app/plugin/GristData';
|
||||
import debounce = require('lodash/debounce');
|
||||
|
||||
/**
|
||||
* An interface for use while editing a virtual table.
|
||||
* This is the interface passed to beforeEdit and afterEdit callbacks.
|
||||
* The getRecord method gives access to the record prior to the edit;
|
||||
* the getRecordNew method gives access to (an internal copy of)
|
||||
* the record after the edit.
|
||||
* The same interface is passed in other places, in which case
|
||||
* actions and delta are trivial.
|
||||
*/
|
||||
export interface IEdit {
|
||||
gristDoc: GristDoc,
|
||||
actions: ProcessedAction[], // UserActions plus corresponding DocActions (forward and undo).
|
||||
delta: TableDelta, // A summary of the effect actions would have (or had).
|
||||
|
||||
/**
|
||||
* Apply a set of actions. The result is from the store backing the
|
||||
* virtual table. Will not trigger beforeEdit or afterEdit callbacks.
|
||||
*/
|
||||
patch(actions: UserAction[]): Promise<ProcessedAction[]>;
|
||||
|
||||
getRecord(rowId: number): RowRecord|undefined; // A record in the table.
|
||||
getRecordNew(rowId: number): RowRecord|undefined; // A record in the table, after the edit.
|
||||
getRowIds(): readonly number[]; // All rowIds in the table.
|
||||
}
|
||||
|
||||
/**
|
||||
* Interface with a back-end for a specific virtual table.
|
||||
*/
|
||||
export interface IExternalTable {
|
||||
name: string; // the tableId of the virtual table (e.g. GristHidden_WebhookTable)
|
||||
initialActions: DocAction[]; // actions to create the table.
|
||||
fetchAll(): Promise<TableDataAction>; // get initial state of the table.
|
||||
sync(editor: IEdit): Promise<void>; // incorporate external changes.
|
||||
beforeEdit(editor: IEdit): Promise<void>; // called prior to committing a change.
|
||||
afterEdit(editor: IEdit): Promise<void>; // called after committing a change.
|
||||
afterAnySchemaChange(editor: IEdit): Promise<void>; // called after any schema change in the document.
|
||||
}
|
||||
|
||||
// A counter to generate unique actionNums for undo actions.
|
||||
let _counterForUndoActions: number = 1;
|
||||
|
||||
/**
|
||||
* A flavor of TableData that is backed by external operations and local cache.
|
||||
* This lets virtual tables "fit in" to a DocData instance.
|
||||
*/
|
||||
export class VirtualTableData extends TableData {
|
||||
|
||||
public gristDoc: GristDoc;
|
||||
public ext: IExternalTable;
|
||||
public cache: DocDataCache;
|
||||
|
||||
constructor(docData: DocData, tableId: string, tableData: TableDataAction|null, columnTypes: ColTypeMap) {
|
||||
super(docData, tableId, tableData, columnTypes);
|
||||
}
|
||||
|
||||
public setExt(_ext: IExternalTable) {
|
||||
this.ext = _ext;
|
||||
this.cache = new DocDataCache(this.ext.initialActions);
|
||||
}
|
||||
|
||||
public get name() {
|
||||
return this.ext.name;
|
||||
}
|
||||
|
||||
public fetchData() {
|
||||
return super.fetchData(async () => {
|
||||
const data = await this.ext.fetchAll();
|
||||
this.cache.docData.getTable(this.name)?.loadData(data);
|
||||
return data;
|
||||
});
|
||||
}
|
||||
|
||||
public async sendTableActions(userActions: UserAction[]): Promise<any[]> {
|
||||
const actions = await this._sendTableActionsCore(userActions,
|
||||
{isUser: true});
|
||||
await this.ext.afterEdit(this._editor(actions));
|
||||
return actions.map(action => action.retValues);
|
||||
}
|
||||
|
||||
public sync() {
|
||||
return this.ext.sync(this._editor());
|
||||
}
|
||||
|
||||
public async sendTableAction(action: UserAction): Promise<any> {
|
||||
const retValues = await this.sendTableActions([action]);
|
||||
return retValues[0];
|
||||
}
|
||||
|
||||
public async schemaChange() {
|
||||
await this.ext.afterAnySchemaChange(this._editor());
|
||||
}
|
||||
|
||||
private _editor(actions: ProcessedAction[] = []): IEdit {
|
||||
const summary = concatenateSummaries(
|
||||
actions
|
||||
.map(action => summarizeStoredAndUndo(action.stored, action.undo)));
|
||||
const delta = summary.tableDeltas[this.name];
|
||||
return {
|
||||
actions,
|
||||
delta,
|
||||
gristDoc: this.gristDoc,
|
||||
getRecord: rowId => this.getRecord(rowId),
|
||||
getRecordNew: rowId => this.getRecord(rowId),
|
||||
getRowIds: () => this.getRowIds(),
|
||||
patch: userActions => this._sendTableActionsCore(userActions, {
|
||||
hasTableIds: true,
|
||||
isUser: false,
|
||||
})
|
||||
};
|
||||
}
|
||||
|
||||
private async _sendTableActionsCore(userActions: UserAction[], options: {
|
||||
isUser: boolean,
|
||||
isUndo?: boolean,
|
||||
hasTableIds?: boolean,
|
||||
actionNum?: any,
|
||||
}): Promise<ProcessedAction[]> {
|
||||
const {isUndo, isUser, hasTableIds} = options;
|
||||
if (!hasTableIds) {
|
||||
userActions.forEach((action) => action.splice(1, 0, this.tableId));
|
||||
}
|
||||
const actions = await this.cache.sendTableActions(userActions);
|
||||
if (isUser) {
|
||||
const newTable = await this.cache.docData.requireTable(this.name);
|
||||
try {
|
||||
await this.ext.beforeEdit({
|
||||
...this._editor(actions),
|
||||
getRecordNew: rowId => newTable.getRecord(rowId),
|
||||
});
|
||||
} catch (e) {
|
||||
actions.reverse();
|
||||
for (const action of actions) {
|
||||
await this.cache.sendTableActions(action.undo);
|
||||
}
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
|
||||
for (const action of actions) {
|
||||
for (const docAction of action.stored) {
|
||||
this.docData.receiveAction(docAction);
|
||||
this.cache.docData.receiveAction(docAction);
|
||||
if (isUser) {
|
||||
const code = `ext-${this.name}-${_counterForUndoActions}`;
|
||||
_counterForUndoActions++;
|
||||
this.gristDoc.getUndoStack().pushAction({
|
||||
actionNum: code,
|
||||
actionHash: 'hash',
|
||||
fromSelf: true,
|
||||
otherId: options.actionNum || 0,
|
||||
linkId: 0,
|
||||
rowIdHint: 0,
|
||||
isUndo,
|
||||
action,
|
||||
op: this._doUndo.bind(this),
|
||||
} as any);
|
||||
}
|
||||
}
|
||||
}
|
||||
return actions;
|
||||
}
|
||||
|
||||
|
||||
private async _doUndo(actionGroup: {
|
||||
action: ProcessedAction,
|
||||
actionNum: number|string,
|
||||
}, isUndo: boolean) {
|
||||
await this._sendTableActionsCore(
|
||||
isUndo ? actionGroup.action.undo : actionGroup.action.stored,
|
||||
{
|
||||
isUndo,
|
||||
isUser: true,
|
||||
actionNum: actionGroup.actionNum,
|
||||
hasTableIds: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Everything needed to run a virtual table. Contains a tableData instance.
|
||||
* Subscribes to schema changes. Offers a debouncing lazySync method that
|
||||
* will attempt to synchronize the virtual table with the external source
|
||||
* one second after last call (or at most 2 seconds after the first
|
||||
* call).
|
||||
*/
|
||||
export class VirtualTable {
|
||||
public lazySync = debounce(this.sync, 1000, {
|
||||
maxWait: 2000,
|
||||
trailing: true,
|
||||
});
|
||||
public tableData: VirtualTableData;
|
||||
|
||||
public constructor(private _owner: DisposableWithEvents,
|
||||
_gristDoc: GristDoc,
|
||||
_ext: IExternalTable) {
|
||||
if (!_gristDoc.docModel.docData.getTable(_ext.name)) {
|
||||
|
||||
// register the virtual table
|
||||
_gristDoc.docModel.docData.registerVirtualTable(_ext.name, VirtualTableData);
|
||||
|
||||
// then process initial actions
|
||||
for (const action of _ext.initialActions) {
|
||||
_gristDoc.docData.receiveAction(action);
|
||||
}
|
||||
|
||||
// pass in gristDoc and external interface
|
||||
this.tableData = _gristDoc.docModel.docData.getTable(_ext.name)! as VirtualTableData;
|
||||
//this.tableData.docApi = this.docApi;
|
||||
this.tableData.gristDoc = _gristDoc;
|
||||
this.tableData.setExt(_ext);
|
||||
|
||||
// subscribe to schema changes
|
||||
this.tableData.schemaChange().catch(e => reportError(e));
|
||||
_owner.listenTo(_gristDoc, 'schemaUpdateAction', () => this.tableData.schemaChange());
|
||||
} else {
|
||||
this.tableData = _gristDoc.docModel.docData.getTable(_ext.name)! as VirtualTableData;
|
||||
}
|
||||
// debounce is typed as returning a promise, but doesn't appear to actually do so?
|
||||
Promise.resolve(this.lazySync()).catch(e => reportError(e));
|
||||
}
|
||||
|
||||
public async sync() {
|
||||
if (this._owner.isDisposed()) {
|
||||
return;
|
||||
}
|
||||
await this.tableData.sync();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,427 @@
|
||||
import { GristDoc } from 'app/client/components/GristDoc';
|
||||
import { ViewSectionHelper } from 'app/client/components/ViewLayout';
|
||||
import { makeT } from 'app/client/lib/localization';
|
||||
import { reportMessage, reportSuccess } from 'app/client/models/errors';
|
||||
import { IEdit, IExternalTable, VirtualTable } from 'app/client/models/VirtualTable';
|
||||
import { docListHeader } from 'app/client/ui/DocMenuCss';
|
||||
import { bigPrimaryButton } from 'app/client/ui2018/buttons';
|
||||
import { mediaSmall, testId } from 'app/client/ui2018/cssVars';
|
||||
import { ApiError } from 'app/common/ApiError';
|
||||
import { DisposableWithEvents } from 'app/common/DisposableWithEvents';
|
||||
import { DocAction, getColIdsFromDocAction, getColValues,
|
||||
isDataAction, TableDataAction, UserAction } from 'app/common/DocActions';
|
||||
import { WebhookSummary } from 'app/common/Triggers';
|
||||
import { DocAPI } from 'app/common/UserAPI';
|
||||
import { GristObjCode, RowRecord } from 'app/plugin/GristData';
|
||||
import { dom, styled } from 'grainjs';
|
||||
import omit = require('lodash/omit');
|
||||
import pick = require('lodash/pick');
|
||||
import range = require('lodash/range');
|
||||
import without = require('lodash/without');
|
||||
|
||||
const t = makeT('WebhookPage');
|
||||
|
||||
/**
|
||||
* A list of columns for a virtual table about webhooks.
|
||||
* The ids need to be strings.
|
||||
*/
|
||||
const WEBHOOK_COLUMNS = [
|
||||
{
|
||||
id: 'vt_webhook_fc1',
|
||||
colId: 'tableId',
|
||||
type: 'Choice',
|
||||
label: 'Table',
|
||||
// widgetOptions are configured later, since the choices depend
|
||||
// on the user tables in the document.
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc2',
|
||||
colId: 'url',
|
||||
type: 'Text',
|
||||
label: 'URL',
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc3',
|
||||
colId: 'eventTypes',
|
||||
type: 'ChoiceList',
|
||||
label: 'Event Types',
|
||||
widgetOptions: JSON.stringify({
|
||||
widget: 'TextBox',
|
||||
alignment: 'left',
|
||||
choices: ['add', 'update'],
|
||||
choiceOptions: {},
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc4',
|
||||
colId: 'enabled',
|
||||
type: 'Bool',
|
||||
label: 'Enabled',
|
||||
widgetOptions: JSON.stringify({
|
||||
widget: 'Switch',
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc5',
|
||||
colId: 'isReadyColumn',
|
||||
type: 'Text',
|
||||
label: 'Ready Column',
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc6',
|
||||
colId: 'webhookId',
|
||||
type: 'Text',
|
||||
label: 'Webhook Id',
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc7',
|
||||
colId: 'name',
|
||||
type: 'Text',
|
||||
label: 'Name',
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc8',
|
||||
colId: 'memo',
|
||||
type: 'Text',
|
||||
label: 'Memo',
|
||||
},
|
||||
{
|
||||
id: 'vt_webhook_fc9',
|
||||
colId: 'status',
|
||||
type: 'Text',
|
||||
label: 'Status',
|
||||
},
|
||||
] as const;
|
||||
|
||||
/**
|
||||
* Layout of fields in a view, with a specific ordering.
|
||||
*/
|
||||
const WEBHOOK_VIEW_FIELDS: Array<(typeof WEBHOOK_COLUMNS)[number]['colId']> = [
|
||||
'name', 'memo',
|
||||
'eventTypes', 'url',
|
||||
'tableId', 'isReadyColumn',
|
||||
'webhookId', 'enabled',
|
||||
'status'
|
||||
];
|
||||
|
||||
/**
|
||||
*
|
||||
* Change webhooks based on a virtual table.
|
||||
*
|
||||
* TODO: error handling is not rock-solid. If a set of actions are
|
||||
* applied all together, and one fails, then state between UI and
|
||||
* back-end may end up being inconsistent. One option would be just to
|
||||
* resync in the case of an error. In practice, the way the virtual
|
||||
* table is used in a card list, it would be hard to tickle this case
|
||||
* right now, so I'm not going to worry about it.
|
||||
*
|
||||
*/
|
||||
class WebhookExternalTable implements IExternalTable {
|
||||
public name = 'GristHidden_WebhookTable';
|
||||
public initialActions = _prepareWebhookInitialActions(this.name);
|
||||
public saveableFields = [
|
||||
'tableId', 'url', 'eventTypes', 'enabled', 'name', 'memo', 'isReadyColumn',
|
||||
];
|
||||
|
||||
public constructor(private _docApi: DocAPI) {}
|
||||
|
||||
public async fetchAll(): Promise<TableDataAction> {
|
||||
const webhooks = await this._docApi.getWebhooks();
|
||||
const indices = range(webhooks.length);
|
||||
return ['TableData', this.name, indices.map(i => i + 1),
|
||||
getColValues(indices.map(rowId => _mapWebhookValues(webhooks[rowId])))];
|
||||
}
|
||||
|
||||
public async beforeEdit(editor: IEdit) {
|
||||
const results = editor.actions;
|
||||
for (const r of results) {
|
||||
for (const d of r.stored) {
|
||||
if (!isDataAction(d)) { continue; }
|
||||
const colIds = new Set(getColIdsFromDocAction(d) || []);
|
||||
if (colIds.has('webhookId') || colIds.has('status')) {
|
||||
throw new Error(`Sorry, not all fields can be edited.`);
|
||||
}
|
||||
}
|
||||
}
|
||||
const delta = editor.delta;
|
||||
for (const recId of delta.removeRows) {
|
||||
const rec = editor.getRecord(recId);
|
||||
if (!rec) { continue; }
|
||||
await this._removeWebhook(rec);
|
||||
reportMessage(`Removed webhook.`);
|
||||
}
|
||||
const updates = new Set(delta.updateRows);
|
||||
const t2 = editor;
|
||||
for (const recId of updates) {
|
||||
const rec = t2.getRecordNew(recId);
|
||||
if (rec?.webhookId) {
|
||||
await this._updateWebhook(String(rec?.webhookId), rec);
|
||||
}
|
||||
}
|
||||
}
|
||||
public async afterEdit(editor: IEdit) {
|
||||
const {delta} = editor;
|
||||
const updates = new Set(delta.updateRows);
|
||||
const addsAndUpdates = new Set([...delta.addRows, ...delta.updateRows]);
|
||||
for (const recId of addsAndUpdates) {
|
||||
const rec = editor.getRecord(recId);
|
||||
if (!rec) { continue; }
|
||||
const notes: string[] = [];
|
||||
const values: Record<string, any> = {};
|
||||
if (!rec.webhookId) {
|
||||
try {
|
||||
const webhookId = await this._addWebhook(rec);
|
||||
values.webhookId = webhookId;
|
||||
notes.push("Added");
|
||||
} catch (e) {
|
||||
notes.push("Incomplete" + ' | ' + this._getErrorString(e).replace(/^Error: /, '').replace('\n', ' | '));
|
||||
}
|
||||
} else {
|
||||
notes.push("Updated");
|
||||
}
|
||||
if (!values.status) {
|
||||
values.status = notes.join('\n');
|
||||
}
|
||||
if (!updates.has(recId)) {
|
||||
// 'enabled' needs an initial value, otherwise it is unsettable
|
||||
values.enabled = false;
|
||||
}
|
||||
await editor.patch([
|
||||
['UpdateRecord', this.name, recId, values],
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
public async sync(editor: IEdit): Promise<void> {
|
||||
// Map from external webhookId to local arbitrary rowId.
|
||||
const rowMap = new Map(editor.getRowIds().map(rowId => [editor.getRecord(rowId)!.webhookId, rowId]));
|
||||
// Provisional list of rows to remove (we'll be trimming this down
|
||||
// as we go).
|
||||
const toRemove = new Set(editor.getRowIds());
|
||||
// Synchronization is done by applying a collected list of actions.
|
||||
const actions: UserAction[] = [];
|
||||
|
||||
// Prepare to add or update webhook listings stored locally. Uses
|
||||
// brute force, on the assumption that there won't be many
|
||||
// webhooks, or that "updating" something that hasn't actually
|
||||
// changed is not disruptive.
|
||||
const webhooks = await this._docApi.getWebhooks();
|
||||
for (const webhook of webhooks) {
|
||||
const values = _mapWebhookValues(webhook);
|
||||
const rowId = rowMap.get(webhook.id);
|
||||
if (rowId) {
|
||||
toRemove.delete(rowId);
|
||||
actions.push(
|
||||
['UpdateRecord', this.name, rowId, values]
|
||||
);
|
||||
} else {
|
||||
actions.push(
|
||||
['AddRecord', this.name, null, values]
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Prepare to remove webhook rows that no longer correspond to something that
|
||||
// exists externally.
|
||||
for (const rowId of toRemove) {
|
||||
if (editor.getRecord(rowId)?.webhookId) {
|
||||
actions.push(['RemoveRecord', this.name, rowId]);
|
||||
}
|
||||
}
|
||||
|
||||
// Apply the changes.
|
||||
await editor.patch(actions);
|
||||
}
|
||||
|
||||
public async afterAnySchemaChange(editor: IEdit) {
|
||||
// Configure the table picker, since the set of tables may have changed.
|
||||
// TODO: should do something about the ready column picker. Right now,
|
||||
// Grist doesn't have a good way to handle contingent choices.
|
||||
const choices = editor.gristDoc.docModel.visibleTables.all().map(tableRec => tableRec.tableId());
|
||||
editor.gristDoc.docData.receiveAction([
|
||||
'UpdateRecord', '_grist_Tables_column', 'vt_webhook_fc1' as any, {
|
||||
widgetOptions: JSON.stringify({
|
||||
widget: 'TextBox',
|
||||
alignment: 'left',
|
||||
choices,
|
||||
})
|
||||
}]);
|
||||
}
|
||||
|
||||
private _getErrorString(e: ApiError): string {
|
||||
return e.details?.userError || e.message;
|
||||
}
|
||||
|
||||
private async _addWebhook(rec: RowRecord) {
|
||||
const fields = this._prepareFields(rec);
|
||||
// Leave enabled at default, meaning it will enable on successful
|
||||
// creation. It seems likely we'd get support requests asking why
|
||||
// webhooks are not working otherwise.
|
||||
const {webhookId} = await this._docApi.addWebhook(omit(fields, 'enabled'));
|
||||
return webhookId;
|
||||
}
|
||||
|
||||
private async _updateWebhook(id: string, rec: RowRecord) {
|
||||
const fields = this._prepareFields(rec);
|
||||
if (Object.keys(fields).length) {
|
||||
await this._docApi.updateWebhook({id, fields});
|
||||
}
|
||||
}
|
||||
|
||||
private async _removeWebhook(rec: RowRecord) {
|
||||
if (rec.webhookId) {
|
||||
await this._docApi.removeWebhook(String(rec.webhookId), String(rec.tableId));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Perform some transformations for sending fields to api:
|
||||
* - (1) removes all non saveble props and
|
||||
* - (2) removes the leading 'L' from eventTypes.
|
||||
*/
|
||||
private _prepareFields(fields: any) {
|
||||
fields = pick(fields, ...this.saveableFields);
|
||||
if (fields.eventTypes) {
|
||||
fields.eventTypes = without(fields.eventTypes, 'L');
|
||||
}
|
||||
return fields;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Visualize webhooks. There's a button to clear the queue, and
|
||||
* a card list of webhooks.
|
||||
*/
|
||||
export class WebhookPage extends DisposableWithEvents {
|
||||
|
||||
public docApi = this.gristDoc.docPageModel.appModel.api.getDocAPI(this.gristDoc.docId());
|
||||
public sharedTable: VirtualTable;
|
||||
|
||||
constructor(public gristDoc: GristDoc) {
|
||||
super();
|
||||
|
||||
const table = new VirtualTable(this, gristDoc, new WebhookExternalTable(this.docApi));
|
||||
this.listenTo(gristDoc, 'webhooks', async () => {
|
||||
await table.lazySync();
|
||||
});
|
||||
}
|
||||
|
||||
public buildDom() {
|
||||
const viewSectionModel = this.gristDoc.docModel.viewSections.getRowModel('vt_webhook_fs1' as any);
|
||||
ViewSectionHelper.create(this, this.gristDoc, viewSectionModel);
|
||||
return cssContainer(
|
||||
cssHeader(t('Webhook Settings')),
|
||||
cssControlRow(
|
||||
bigPrimaryButton(t("Clear Queue"),
|
||||
dom.on('click', () => this.reset()),
|
||||
testId('webhook-reset'),
|
||||
),
|
||||
),
|
||||
// active_section here is a bit of a hack, to allow tests to run
|
||||
// more easily.
|
||||
dom('div.active_section.view_data_pane_container.flexvbox', viewSectionModel.viewInstance()!.viewPane),
|
||||
);
|
||||
}
|
||||
|
||||
public async reset() {
|
||||
await this.docApi.flushWebhooks();
|
||||
reportSuccess('Cleared webhook queue.');
|
||||
}
|
||||
}
|
||||
|
||||
const cssHeader = styled(docListHeader, `
|
||||
margin-bottom: 0;
|
||||
&:not(:first-of-type) {
|
||||
margin-top: 40px;
|
||||
}
|
||||
`);
|
||||
|
||||
const cssControlRow = styled('div', `
|
||||
flex: none;
|
||||
margin-bottom: 16px;
|
||||
margin-top: 16px;
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
`);
|
||||
|
||||
const cssContainer = styled('div', `
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
padding: 32px 64px 24px 64px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@media ${mediaSmall} {
|
||||
& {
|
||||
padding: 32px 24px 24px 24px;
|
||||
}
|
||||
}
|
||||
`);
|
||||
|
||||
|
||||
/**
|
||||
* Actions needed to create the virtual table about webhooks, and a
|
||||
* view for it. There are some "any" casts to place string ids where
|
||||
* numbers are expected.
|
||||
*/
|
||||
function _prepareWebhookInitialActions(tableId: string): DocAction[] {
|
||||
return [[
|
||||
// Add the virtual table.
|
||||
'AddTable', tableId,
|
||||
WEBHOOK_COLUMNS.map(col => ({
|
||||
isFormula: true,
|
||||
type: 'Any',
|
||||
formula: '',
|
||||
id: col.colId
|
||||
}))
|
||||
], [
|
||||
// Add an entry for the virtual table.
|
||||
'AddRecord', '_grist_Tables', 'vt_webhook_ft1' as any, { tableId, primaryViewId: 0 },
|
||||
], [
|
||||
// Add entries for the columns of the virtual table.
|
||||
'BulkAddRecord', '_grist_Tables_column',
|
||||
WEBHOOK_COLUMNS.map(col => col.id) as any, getColValues(WEBHOOK_COLUMNS.map(rec =>
|
||||
Object.assign({
|
||||
isFormula: false,
|
||||
formula: '',
|
||||
widgetOptions: '',
|
||||
parentId: 'vt_webhook_ft1' as any,
|
||||
}, omit(rec, ['id']) as any))),
|
||||
], [
|
||||
// Add a view section.
|
||||
'AddRecord', '_grist_Views_section', 'vt_webhook_fs1' as any,
|
||||
{ tableRef: 'vt_webhook_ft1', parentKey: 'detail', title: '', borderWidth: 1, defaultWidth: 100, theme: 'blocks' }
|
||||
], [
|
||||
// List the fields shown in the view section.
|
||||
'BulkAddRecord', '_grist_Views_section_field', WEBHOOK_VIEW_FIELDS.map((_, i) => `vt_webhook_ff${i+1}`) as any, {
|
||||
colRef: WEBHOOK_VIEW_FIELDS.map(colId => WEBHOOK_COLUMNS.find(r => r.colId === colId)!.id),
|
||||
parentId: WEBHOOK_VIEW_FIELDS.map(() => 'vt_webhook_fs1'),
|
||||
parentPos: WEBHOOK_VIEW_FIELDS.map((_, i) => i),
|
||||
}
|
||||
]];
|
||||
}
|
||||
|
||||
/**
|
||||
* Map a webhook summary to a webhook table raw record. The main
|
||||
* difference is that `eventTypes` is tweaked to be in a cell format,
|
||||
* and `status` is converted to a string.
|
||||
*/
|
||||
function _mapWebhookValues(webhookSummary: WebhookSummary): Partial<WebhookSchemaType> {
|
||||
const fields = webhookSummary.fields;
|
||||
const {eventTypes} = fields;
|
||||
return {
|
||||
...fields,
|
||||
webhookId: webhookSummary.id,
|
||||
status: JSON.stringify(webhookSummary.usage),
|
||||
eventTypes: [GristObjCode.List, ...eventTypes],
|
||||
};
|
||||
}
|
||||
|
||||
type WebhookSchemaType = {
|
||||
[prop in keyof WebhookSummary['fields']]: WebhookSummary['fields'][prop]
|
||||
} & {
|
||||
eventTypes: [GristObjCode, ...unknown[]];
|
||||
status: string;
|
||||
webhookId: string;
|
||||
}
|
||||
@ -0,0 +1,200 @@
|
||||
import { BulkColValues, ColValues, DocAction, isSchemaAction,
|
||||
TableDataAction, UserAction } from 'app/common/DocActions';
|
||||
|
||||
const ACTION_TYPES = new Set([
|
||||
'AddRecord', 'BulkAddRecord', 'UpdateRecord', 'BulkUpdateRecord',
|
||||
'RemoveRecord', 'BulkRemoveRecord'
|
||||
]);
|
||||
|
||||
/**
|
||||
* The result of processing a UserAction.
|
||||
*/
|
||||
export interface ProcessedAction {
|
||||
stored: DocAction[];
|
||||
undo: DocAction[];
|
||||
retValues: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* A minimal interface for interpreting UserActions in the context of
|
||||
* some current state. We need to know the next free rowId for each
|
||||
* table, and also the current state of cells. This interface was
|
||||
* abstracted from the initial implementation of on-demand tables.
|
||||
*/
|
||||
export interface AlternateStorage {
|
||||
getNextRowId(tableId: string): Promise<number>;
|
||||
fetchActionData(tableId: string, rowIds: number[],
|
||||
colIds?: string[]): Promise<TableDataAction>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle converting UserActions to DocActions for tables stored
|
||||
* in some way that is not handled by the regular data engine.
|
||||
*/
|
||||
export class AlternateActions {
|
||||
|
||||
constructor(private _storage: AlternateStorage) {}
|
||||
|
||||
/**
|
||||
* This may be overridden to allow mixing two different storage mechanisms.
|
||||
* The implementation of on-demand tables does this.
|
||||
*/
|
||||
public usesAlternateStorage(tableId: string): boolean {
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Convert a UserAction into stored and undo DocActions as well as return values.
|
||||
*/
|
||||
public processUserAction(action: UserAction): Promise<ProcessedAction> {
|
||||
const a = action.map(item => item as any);
|
||||
switch (a[0]) {
|
||||
case "ApplyUndoActions": return this._doApplyUndoActions(a[1]);
|
||||
case "AddRecord": return this._doAddRecord (a[1], a[2], a[3]);
|
||||
case "BulkAddRecord": return this._doBulkAddRecord (a[1], a[2], a[3]);
|
||||
case "UpdateRecord": return this._doUpdateRecord (a[1], a[2], a[3]);
|
||||
case "BulkUpdateRecord": return this._doBulkUpdateRecord(a[1], a[2], a[3]);
|
||||
case "RemoveRecord": return this._doRemoveRecord (a[1], a[2]);
|
||||
case "BulkRemoveRecord": return this._doBulkRemoveRecord(a[1], a[2]);
|
||||
default: throw new Error(`Received unknown action ${action[0]}`);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Splits an array of UserActions into two separate arrays of normal and onDemand actions.
|
||||
*/
|
||||
public splitByStorage(actions: UserAction[]): [UserAction[], UserAction[]] {
|
||||
const normal: UserAction[] = [];
|
||||
const onDemand: UserAction[] = [];
|
||||
actions.forEach(a => {
|
||||
// Check that the actionType can be applied without the sandbox and also that the action
|
||||
// is on a data table.
|
||||
const isOnDemandAction = ACTION_TYPES.has(a[0] as string);
|
||||
const isDataTableAction = typeof a[1] === 'string' && !a[1].startsWith('_grist_');
|
||||
if (a[0] === 'ApplyUndoActions') {
|
||||
// Split actions inside the undo action array.
|
||||
const [undoNormal, undoOnDemand] = this.splitByStorage(a[1] as UserAction[]);
|
||||
if (undoNormal.length > 0) {
|
||||
normal.push(['ApplyUndoActions', undoNormal]);
|
||||
}
|
||||
if (undoOnDemand.length > 0) {
|
||||
onDemand.push(['ApplyUndoActions', undoOnDemand]);
|
||||
}
|
||||
} else if (isDataTableAction && isOnDemandAction && this.usesAlternateStorage(a[1] as string)) {
|
||||
// Check whether the tableId belongs to an onDemand table.
|
||||
onDemand.push(a);
|
||||
} else {
|
||||
normal.push(a);
|
||||
}
|
||||
});
|
||||
return [normal, onDemand];
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if an action represents a schema change on an onDemand table.
|
||||
*/
|
||||
public isSchemaAction(docAction: DocAction): boolean {
|
||||
return isSchemaAction(docAction) && this.usesAlternateStorage(docAction[1]);
|
||||
}
|
||||
|
||||
private async _doApplyUndoActions(actions: DocAction[]) {
|
||||
const undo: DocAction[] = [];
|
||||
for (const a of actions) {
|
||||
const converted = await this.processUserAction(a);
|
||||
undo.concat(converted.undo);
|
||||
}
|
||||
return {
|
||||
stored: actions,
|
||||
undo,
|
||||
retValues: null
|
||||
};
|
||||
}
|
||||
|
||||
private async _doAddRecord(
|
||||
tableId: string,
|
||||
rowId: number|null,
|
||||
colValues: ColValues
|
||||
): Promise<ProcessedAction> {
|
||||
if (rowId === null) {
|
||||
rowId = await this._storage.getNextRowId(tableId);
|
||||
}
|
||||
// Set the manualSort to be the same as the rowId. This forces new rows to always be added
|
||||
// at the end of the table.
|
||||
colValues.manualSort = rowId;
|
||||
return {
|
||||
stored: [['AddRecord', tableId, rowId, colValues]],
|
||||
undo: [['RemoveRecord', tableId, rowId]],
|
||||
retValues: rowId
|
||||
};
|
||||
}
|
||||
|
||||
private async _doBulkAddRecord(
|
||||
tableId: string,
|
||||
rowIds: Array<number|null>,
|
||||
colValues: BulkColValues
|
||||
): Promise<ProcessedAction> {
|
||||
|
||||
// When unset, we will set the rowId values to count up from the greatest
|
||||
// values already in the table.
|
||||
if (rowIds[0] === null) {
|
||||
const nextRowId = await this._storage.getNextRowId(tableId);
|
||||
for (let i = 0; i < rowIds.length; i++) {
|
||||
rowIds[i] = nextRowId + i;
|
||||
}
|
||||
}
|
||||
// Set the manualSort values to be the same as the rowIds. This forces new rows to always be
|
||||
// added at the end of the table.
|
||||
colValues.manualSort = rowIds;
|
||||
return {
|
||||
stored: [['BulkAddRecord', tableId, rowIds as number[], colValues]],
|
||||
undo: [['BulkRemoveRecord', tableId, rowIds as number[]]],
|
||||
retValues: rowIds
|
||||
};
|
||||
}
|
||||
|
||||
private async _doUpdateRecord(
|
||||
tableId: string,
|
||||
rowId: number,
|
||||
colValues: ColValues
|
||||
): Promise<ProcessedAction> {
|
||||
const [, , oldRowIds, oldColValues] =
|
||||
await this._storage.fetchActionData(tableId, [rowId], Object.keys(colValues));
|
||||
return {
|
||||
stored: [['UpdateRecord', tableId, rowId, colValues]],
|
||||
undo: [['BulkUpdateRecord', tableId, oldRowIds, oldColValues]],
|
||||
retValues: null
|
||||
};
|
||||
}
|
||||
|
||||
private async _doBulkUpdateRecord(
|
||||
tableId: string,
|
||||
rowIds: number[],
|
||||
colValues: BulkColValues
|
||||
): Promise<ProcessedAction> {
|
||||
const [, , oldRowIds, oldColValues] =
|
||||
await this._storage.fetchActionData(tableId, rowIds, Object.keys(colValues));
|
||||
return {
|
||||
stored: [['BulkUpdateRecord', tableId, rowIds, colValues]],
|
||||
undo: [['BulkUpdateRecord', tableId, oldRowIds, oldColValues]],
|
||||
retValues: null
|
||||
};
|
||||
}
|
||||
|
||||
private async _doRemoveRecord(tableId: string, rowId: number): Promise<ProcessedAction> {
|
||||
const [, , oldRowIds, oldColValues] = await this._storage.fetchActionData(tableId, [rowId]);
|
||||
return {
|
||||
stored: [['RemoveRecord', tableId, rowId]],
|
||||
undo: [['BulkAddRecord', tableId, oldRowIds, oldColValues]],
|
||||
retValues: null
|
||||
};
|
||||
}
|
||||
|
||||
private async _doBulkRemoveRecord(tableId: string, rowIds: number[]): Promise<ProcessedAction> {
|
||||
const [, , oldRowIds, oldColValues] = await this._storage.fetchActionData(tableId, rowIds);
|
||||
return {
|
||||
stored: [['BulkRemoveRecord', tableId, rowIds]],
|
||||
undo: [['BulkAddRecord', tableId, oldRowIds, oldColValues]],
|
||||
retValues: null
|
||||
};
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,51 @@
|
||||
import { AlternateActions, AlternateStorage, ProcessedAction} from 'app/common/AlternateActions';
|
||||
import { DocAction, UserAction } from 'app/common/DocActions';
|
||||
import { DocData } from 'app/common/DocData';
|
||||
import max from 'lodash/max';
|
||||
|
||||
/**
|
||||
* An implementation of an in-memory storage that can handle UserActions,
|
||||
* generating DocActions and retValues that work as for regular storage.
|
||||
* It shares an implementation with on-demand tables.
|
||||
*/
|
||||
export class DocDataCache implements AlternateStorage {
|
||||
public docData: DocData;
|
||||
private _altActions: AlternateActions;
|
||||
constructor(actions?: DocAction[]) {
|
||||
this.docData = new DocData(
|
||||
async (tableId) => {
|
||||
throw new Error(`no ${tableId}`);
|
||||
},
|
||||
null,
|
||||
);
|
||||
this._altActions = new AlternateActions(this);
|
||||
for (const action of actions || []) {
|
||||
this.docData.receiveAction(action);
|
||||
}
|
||||
}
|
||||
|
||||
public async sendTableActions(actions: UserAction[]): Promise<ProcessedAction[]> {
|
||||
const results: ProcessedAction[] = [];
|
||||
for (const userAction of actions) {
|
||||
const processedAction = await this._altActions.processUserAction(userAction);
|
||||
results.push(processedAction);
|
||||
for (const storedAction of processedAction.stored) {
|
||||
this.docData.receiveAction(storedAction);
|
||||
}
|
||||
}
|
||||
return results;
|
||||
}
|
||||
|
||||
public async fetchActionData(tableId: string, rowIds: number[], colIds?: string[]) {
|
||||
const table = await this.docData.requireTable(tableId);
|
||||
return table.getTableDataAction(
|
||||
rowIds,
|
||||
colIds,
|
||||
);
|
||||
}
|
||||
|
||||
public async getNextRowId(tableId: string): Promise<number> {
|
||||
const table = await this.docData.requireTable(tableId);
|
||||
return (max(table.getRowIds()) || 0) + 1;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,275 @@
|
||||
import { DocCreationInfo } from 'app/common/DocListAPI';
|
||||
import { DocAPI } from 'app/common/UserAPI';
|
||||
import { assert, driver, Key } from 'mocha-webdriver';
|
||||
import * as gu from 'test/nbrowser/gristUtils';
|
||||
import { setupTestSuite } from 'test/nbrowser/testUtils';
|
||||
import { EnvironmentSnapshot } from 'test/server/testUtils';
|
||||
import { server } from 'test/nbrowser/testUtils';
|
||||
//import { Deps as TriggersDeps } from 'app/server/lib/Triggers';
|
||||
|
||||
describe('WebhookPage', function () {
|
||||
this.timeout(30000);
|
||||
const cleanup = setupTestSuite();
|
||||
|
||||
let session: gu.Session;
|
||||
let oldEnv: EnvironmentSnapshot;
|
||||
let docApi: DocAPI;
|
||||
let doc: DocCreationInfo;
|
||||
let host: string;
|
||||
|
||||
before(async function () {
|
||||
oldEnv = new EnvironmentSnapshot();
|
||||
host = new URL(server.getHost()).host;
|
||||
process.env.ALLOWED_WEBHOOK_DOMAINS = host;
|
||||
await server.restart();
|
||||
session = await gu.session().teamSite.login();
|
||||
const api = session.createHomeApi();
|
||||
doc = await session.tempDoc(cleanup, 'Hello.grist');
|
||||
docApi = api.getDocAPI(doc.id);
|
||||
await api.applyUserActions(doc.id, [
|
||||
['AddTable', 'Table2', [{id: 'A'}, {id: 'B'}, {id: 'C'}, {id: 'D'}, {id: 'E'}]],
|
||||
]);
|
||||
await api.applyUserActions(doc.id, [
|
||||
['AddTable', 'Table3', [{id: 'A'}, {id: 'B'}, {id: 'C'}, {id: 'D'}, {id: 'E'}]],
|
||||
]);
|
||||
await api.updateDocPermissions(doc.id, {
|
||||
users: {
|
||||
// for convenience, we'll be sending payloads to the document itself.
|
||||
'anon@getgrist.com': 'editors',
|
||||
// check another owner's perspective.
|
||||
[gu.session().user('user2').email]: 'owners',
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
after(async function () {
|
||||
oldEnv.restore();
|
||||
});
|
||||
|
||||
it('starts with an empty card', async function () {
|
||||
await openWebhookPage();
|
||||
assert.equal(await gu.getCardListCount(), 1); // includes empty card
|
||||
assert.sameDeepMembers(await gu.getCardFieldLabels(), [
|
||||
'Name',
|
||||
'Memo',
|
||||
'Event Types',
|
||||
'URL',
|
||||
'Table',
|
||||
'Ready Column',
|
||||
'Webhook Id',
|
||||
'Enabled',
|
||||
'Status',
|
||||
]);
|
||||
});
|
||||
|
||||
it('can create a persistent webhook', async function () {
|
||||
// Set up a webhook for Table1, and send it to Table2 (for ease of testing).
|
||||
await openWebhookPage();
|
||||
await setField(1, 'Event Types', 'add\nupdate\n');
|
||||
await setField(1, 'URL', `http://${host}/api/docs/${doc.id}/tables/Table2/records?flat=1`);
|
||||
await setField(1, 'Table', 'Table1');
|
||||
// Once event types, URL, and table are set, the webhook is created.
|
||||
// Up until that point, nothing we've entered is actually persisted,
|
||||
// there is no back end for it.
|
||||
await gu.waitToPass(async () => {
|
||||
assert.include(await getField(1, 'Webhook Id'), '-');
|
||||
});
|
||||
const id = await getField(1, 'Webhook Id');
|
||||
// Reload and make sure the webhook id is still there.
|
||||
await driver.navigate().refresh();
|
||||
await waitForWebhookPage();
|
||||
await gu.waitToPass(async () => {
|
||||
assert.equal(await getField(1, 'Webhook Id'), id);
|
||||
});
|
||||
// Now other fields like name and memo are persisted.
|
||||
await setField(1, 'Name', 'Test Webhook');
|
||||
await setField(1, 'Memo', 'Test Memo');
|
||||
await gu.waitForServer();
|
||||
await driver.navigate().refresh();
|
||||
await waitForWebhookPage();
|
||||
await gu.waitToPass(async () => {
|
||||
assert.equal(await getField(1, 'Name'), 'Test Webhook');
|
||||
assert.equal(await getField(1, 'Memo'), 'Test Memo');
|
||||
});
|
||||
// Make sure the webhook is actually working.
|
||||
await docApi.addRows('Table1', {A: ['zig'], B: ['zag']});
|
||||
// Make sure the data gets delivered, and that the webhook status is updated.
|
||||
await gu.waitToPass(async () => {
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 1);
|
||||
assert.equal((await docApi.getRows('Table2')).A[0], 'zig');
|
||||
assert.match(await getField(1, 'Status'), /status...success/);
|
||||
});
|
||||
// Remove the webhook and make sure it is no longer listed.
|
||||
assert.equal(await gu.getCardListCount(), 2);
|
||||
await gu.getDetailCell({col: 'Name', rowNum: 1}).click();
|
||||
await gu.sendKeys(Key.chord(await gu.modKey(), Key.DELETE));
|
||||
await gu.confirm(true, true);
|
||||
await gu.waitForServer();
|
||||
assert.equal(await gu.getCardListCount(), 1);
|
||||
await driver.navigate().refresh();
|
||||
await waitForWebhookPage();
|
||||
assert.equal(await gu.getCardListCount(), 1);
|
||||
await docApi.removeRows('Table2', [1]);
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 0);
|
||||
});
|
||||
|
||||
it('can create two webhooks', async function () {
|
||||
await openWebhookPage();
|
||||
await setField(1, 'Event Types', 'add\nupdate\n');
|
||||
await setField(1, 'URL', `http://${host}/api/docs/${doc.id}/tables/Table2/records?flat=1`);
|
||||
await setField(1, 'Table', 'Table1');
|
||||
await gu.waitForServer();
|
||||
await setField(2, 'Event Types', 'add\n');
|
||||
await setField(2, 'URL', `http://${host}/api/docs/${doc.id}/tables/Table3/records?flat=1`);
|
||||
await setField(2, 'Table', 'Table1');
|
||||
await gu.waitForServer();
|
||||
await docApi.addRows('Table1', {A: ['zig2'], B: ['zag2']});
|
||||
await gu.waitToPass(async () => {
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 1);
|
||||
assert.lengthOf((await docApi.getRows('Table3')).A, 1);
|
||||
assert.match(await getField(1, 'Status'), /status...success/);
|
||||
assert.match(await getField(2, 'Status'), /status...success/);
|
||||
});
|
||||
await docApi.updateRows('Table1', {id: [1], A: ['zig3'], B: ['zag3']});
|
||||
await gu.waitToPass(async () => {
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 2);
|
||||
assert.lengthOf((await docApi.getRows('Table3')).A, 1);
|
||||
assert.match(await getField(1, 'Status'), /status...success/);
|
||||
});
|
||||
await driver.sleep(100);
|
||||
// confirm that nothing shows up to Table3.
|
||||
assert.lengthOf((await docApi.getRows('Table3')).A, 1);
|
||||
// Break everything down.
|
||||
await gu.getDetailCell({col: 'Name', rowNum: 1}).click();
|
||||
await gu.sendKeys(Key.chord(await gu.modKey(), Key.DELETE));
|
||||
await gu.confirm(true, true);
|
||||
await gu.waitForServer();
|
||||
await gu.getDetailCell({col: 'Memo', rowNum: 1}).click();
|
||||
await gu.sendKeys(Key.chord(await gu.modKey(), Key.DELETE));
|
||||
await gu.waitForServer();
|
||||
assert.equal(await gu.getCardListCount(), 1);
|
||||
await driver.navigate().refresh();
|
||||
await waitForWebhookPage();
|
||||
assert.equal(await gu.getCardListCount(), 1);
|
||||
await docApi.removeRows('Table2', [1, 2]);
|
||||
await docApi.removeRows('Table3', [1]);
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 0);
|
||||
assert.lengthOf((await docApi.getRows('Table3')).A, 0);
|
||||
});
|
||||
|
||||
it('can create and repair a dud webhook', async function () {
|
||||
await openWebhookPage();
|
||||
await setField(1, 'Event Types', 'add\nupdate\n');
|
||||
await setField(1, 'URL', `http://${host}/notathing`);
|
||||
await setField(1, 'Table', 'Table1');
|
||||
await gu.waitForServer();
|
||||
await docApi.addRows('Table1', {A: ['dud1']});
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'Status'), /status...failure/);
|
||||
assert.match(await getField(1, 'Status'), /numWaiting..1/);
|
||||
});
|
||||
await setField(1, 'URL', `http://${host}/api/docs/${doc.id}/tables/Table2/records?flat=1`);
|
||||
await driver.findContent('button', /Clear Queue/).click();
|
||||
await gu.waitForServer();
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'Status'), /numWaiting..0/);
|
||||
});
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 0);
|
||||
await docApi.addRows('Table1', {A: ['dud2']});
|
||||
await gu.waitToPass(async () => {
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 1);
|
||||
assert.match(await getField(1, 'Status'), /status...success/);
|
||||
});
|
||||
|
||||
// Break everything down.
|
||||
await gu.getDetailCell({col: 'Name', rowNum: 1}).click();
|
||||
await gu.sendKeys(Key.chord(await gu.modKey(), Key.DELETE));
|
||||
await gu.confirm(true, true);
|
||||
await gu.waitForServer();
|
||||
await docApi.removeRows('Table2', [1]);
|
||||
assert.lengthOf((await docApi.getRows('Table2')).A, 0);
|
||||
});
|
||||
|
||||
it('can keep multiple sessions in sync', async function () {
|
||||
await openWebhookPage();
|
||||
|
||||
// Open another tab.
|
||||
await driver.executeScript("return window.open('about:blank', '_blank')");
|
||||
const [ownerTab, owner2Tab] = await driver.getAllWindowHandles();
|
||||
|
||||
await driver.switchTo().window(owner2Tab);
|
||||
const otherSession = await gu.session().teamSite.user('user2').login();
|
||||
await otherSession.loadDoc(`/doc/${doc.id}`);
|
||||
await openWebhookPage();
|
||||
await setField(1, 'Event Types', 'add\nupdate\n');
|
||||
await setField(1, 'URL', `http://${host}/multiple`);
|
||||
await setField(1, 'Table', 'Table1');
|
||||
await gu.waitForServer();
|
||||
await driver.switchTo().window(ownerTab);
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'URL'), /multiple/);
|
||||
});
|
||||
assert.equal(await gu.getCardListCount(), 2);
|
||||
await setField(1, 'Memo', 'multiple memo');
|
||||
await driver.switchTo().window(owner2Tab);
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'Memo'), /multiple memo/);
|
||||
});
|
||||
|
||||
// Basic undo support.
|
||||
await driver.switchTo().window(ownerTab);
|
||||
await gu.undo();
|
||||
await gu.waitToPass(async () => {
|
||||
assert.equal(await getField(1, 'Memo'), '');
|
||||
});
|
||||
await driver.switchTo().window(owner2Tab);
|
||||
await gu.waitToPass(async () => {
|
||||
assert.equal(await getField(1, 'Memo'), '');
|
||||
});
|
||||
|
||||
// Basic redo support.
|
||||
await driver.switchTo().window(ownerTab);
|
||||
await gu.redo();
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'Memo'), /multiple memo/);
|
||||
});
|
||||
await driver.switchTo().window(owner2Tab);
|
||||
await gu.waitToPass(async () => {
|
||||
assert.match(await getField(1, 'Memo'), /multiple memo/);
|
||||
});
|
||||
|
||||
await gu.getDetailCell({col: 'Name', rowNum: 1}).click();
|
||||
await gu.sendKeys(Key.chord(await gu.modKey(), Key.DELETE));
|
||||
await gu.confirm(true, true);
|
||||
await driver.switchTo().window(ownerTab);
|
||||
await gu.waitToPass(async () => {
|
||||
assert.equal(await gu.getCardListCount(), 1);
|
||||
});
|
||||
await driver.switchTo().window(owner2Tab);
|
||||
await driver.close();
|
||||
await driver.switchTo().window(ownerTab);
|
||||
});
|
||||
});
|
||||
|
||||
async function setField(rowNum: number, col: string, text: string) {
|
||||
await gu.getDetailCell({col, rowNum}).click();
|
||||
await gu.enterCell(text);
|
||||
}
|
||||
|
||||
async function getField(rowNum: number, col: string) {
|
||||
const cell = await gu.getDetailCell({col, rowNum});
|
||||
return cell.getText();
|
||||
}
|
||||
|
||||
async function openWebhookPage() {
|
||||
await gu.openDocumentSettings();
|
||||
const button = await driver.findContentWait('a', /Manage Webhooks/, 3000);
|
||||
await gu.scrollIntoView(button).click();
|
||||
await waitForWebhookPage();
|
||||
}
|
||||
|
||||
async function waitForWebhookPage() {
|
||||
await driver.findContentWait('button', /Clear Queue/, 3000);
|
||||
// No section, so no easy utility for setting focus. Click on a random cell.
|
||||
await gu.getDetailCell({col: 'Webhook Id', rowNum: 1}).click();
|
||||
}
|
||||
Loading…
Reference in new issue