[Visual Editor] Copy & paste

Composer/cypress/integration/Breadcrumb.spec.js

@@ -1,39 +1,72 @@
 /// <reference types="Cypress" />
 
 context('breadcrumb', () => {
-  beforeEach(() => {
+  before(() => {
     cy.visit(Cypress.env('COMPOSER_URL'));
     cy.openBot('ToDoBot');
   });
 
+  beforeEach(() => {
+    // Return to Main.dialog
+    cy.get('[data-testid="ProjectTree"]').within(() => {
+      cy.getByText('ToDoBot.Main').click();
+    });
+  });
+
   it('can show dialog name in breadcrumb', () => {
+    // Should path = main dialog at first render
     cy.getByTestId('Breadcrumb')
       .invoke('text')
       .should('contain', 'ToDoBot.Main');
 
+    // Click on AddToDo dialog
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('AddToDo').click();
     });
-
     cy.getByTestId('Breadcrumb')
       .invoke('text')
       .should('contain', 'AddToDo');
 
+    // Return to Main.dialog
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('ToDoBot.Main').click();
-      cy.getByText('#AddIntent').click();
     });
 
-    cy.withinEditor('VisualEditor', () => {
-      cy.getByText('AddIntent').click();
+    cy.getByTestId('Breadcrumb')
+      .invoke('text')
+      .should('contain', 'ToDoBot');
+  });
+
+  it('can show event name in breadcrumb', () => {
+    cy.get('[data-testid="ProjectTree"]').within(() => {
+      cy.getByText('AddToDo').click();
+      cy.wait(100);
+      cy.getByText('Handle an Event: BeginDialog').click();
       cy.wait(100);
+    });
+
+    cy.getByTestId('Breadcrumb')
+      .invoke('text')
+      .should('match', /AddToDo.*Handle an Event.*/);
+  });
+
+  it('can show action name in breadcrumb', () => {
+    cy.wait(100);
+    cy.get('[data-testid="ProjectTree"]').within(() => {
+      cy.getByText('ToDoBot.Main').click();
+      cy.wait(500);
+    });
+
+    // Click on an action
+    cy.withinEditor('VisualEditor', () => {
       cy.getByTestId('RuleEditor').within(() => {
-        cy.getByText('AddToDo').click();
+        cy.getByText('Send an Activity').click();
+        cy.wait(500);
       });
     });
 
     cy.getByTestId('Breadcrumb')
       .invoke('text')
-      .should('match', /ToDoBot.+AddToDo/);
+      .should('match', /ToDoBot.+Send an Activity/);
   });
 });

Composer/cypress/integration/CreateNewBot.spec.js

@@ -3,13 +3,20 @@
 context('Creating a new bot', () => {
   beforeEach(() => {
     cy.visit(Cypress.env('COMPOSER_URL'));
+    cy.wait(1000);
+    cy.get('[data-testid="LeftNav-CommandBarButtonHome"]').click();
+    cy.wait(5000);
+    cy.get('[data-testid="homePage-ToolBar-New"]').within(() => {
+      cy.getByText('New').click();
+    });
+    cy.wait(5000);
   });
 
   it('can create a new bot', () => {
-    cy.get('[data-testid="LeftNav-CommandBarButtonHome"]').click();
-    cy.get('[data-testid="homePage-ToolBar-New"]').click();
     cy.get('input[data-testid="Create from scratch"]').click();
+    cy.wait(100);
     cy.get('button[data-testid="NextStepButton"]').click();
+    cy.wait(100);
     cy.get('input[data-testid="NewDialogName"]').type('__TestNewProject');
     cy.get('input[data-testid="NewDialogName"]').type('{enter}');
     cy.get('[data-testid="ProjectTree"]').within(() => {
@@ -18,10 +25,12 @@ context('Creating a new bot', () => {
   });
 
   it('can create a bot from the ToDo template', () => {
-    cy.get('[data-testid="homePage-ToolBar-New"]').click();
     cy.get('input[data-testid="Create from template"]').click({ force: true });
+    cy.wait(100);
     cy.get('[data-testid="ToDoBot"]').click();
+    cy.wait(100);
     cy.get('button[data-testid="NextStepButton"]').click();
+    cy.wait(100);
     cy.get('input[data-testid="NewDialogName"]').type('__TestNewProject');
     cy.get('input[data-testid="NewDialogName"]').type('{enter}');
     cy.get('[data-testid="ProjectTree"]').within(() => {

Composer/cypress/integration/LUPage.spec.js

@@ -1,7 +1,7 @@
 /// <reference types="Cypress" />
 
 context('check language understanding page', () => {
-  beforeEach(() => {
+  before(() => {
     cy.visit(Cypress.env('COMPOSER_URL'));
     cy.openBot('ToDoLuisBot');
   });

Composer/cypress/integration/LuisDeploy.spec.js

@@ -31,6 +31,7 @@ context('Luis Deploy', () => {
       response: 'fixture:luPublish/success',
     });
     cy.getByText('Start Bot').click();
+    cy.wait(5000);
     // clear its settings before
     cy.get('[data-testid="ProjectNameInput"]')
       .clear()
@@ -44,6 +45,7 @@ context('Luis Deploy', () => {
     // wait for the debounce interval of sync settings
     cy.wait(1000);
     cy.getByText('Publish').click();
+    cy.wait(1000);
     cy.getByText('Restart Bot').should('exist');
     cy.getByText('Test in Emulator').should('exist');
 
@@ -54,7 +56,9 @@ context('Luis Deploy', () => {
       response: 'fixture:luPublish/error',
     });
     cy.getByText('Restart Bot').click();
+    cy.wait(1000);
     cy.getByText('Try again').click();
+    cy.wait(1000);
     cy.get('[data-testid="AuthoringKeyInput"]').type('no-id');
     cy.getByText('Publish').click();
   });

Composer/cypress/integration/RemoveDialog.spec.js

@@ -16,7 +16,9 @@ context('RemoveDialog', () => {
         .invoke('attr', 'style', 'visibility: visible')
         .click();
     });
-    cy.getByText('Delete').click();
+    cy.get('.ms-ContextualMenu-linkContent > .ms-ContextualMenu-itemText').within(() => {
+      cy.getByText('Delete').click();
+    });
     cy.getByText('Yes').click();
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.get('[title="AddItem"]').should('not.exist');

Composer/cypress/integration/ToDoBot.spec.js

@@ -1,14 +1,15 @@
 /// <reference types="Cypress" />
 
 context('ToDo Bot', () => {
-  beforeEach(() => {
+  before(() => {
     cy.visit(Cypress.env('COMPOSER_URL'));
     cy.openBot('ToDoBot');
   });
 
   it('can open the main dialog', () => {
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('ToDoBot.Main').click();
+      cy.wait(100);
     });
     cy.withinEditor('FormEditor', () => {
       cy.getByDisplayValue('ToDoBot.Main').should('exist');
@@ -33,6 +34,7 @@ context('ToDo Bot', () => {
   it('can open the ClearToDos dialog', () => {
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('ClearToDos').click();
+      cy.wait(100);
     });
 
     cy.withinEditor('FormEditor', () => {
@@ -46,6 +48,7 @@ context('ToDo Bot', () => {
   it('can open the DeleteToDo dialog', () => {
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('DeleteToDo').click();
+      cy.wait(100);
     });
 
     cy.withinEditor('FormEditor', () => {
@@ -59,6 +62,7 @@ context('ToDo Bot', () => {
   it('can open the ShowToDos dialog', () => {
     cy.get('[data-testid="ProjectTree"]').within(() => {
       cy.getByText('ShowToDos').click();
+      cy.wait(100);
     });
 
     cy.withinEditor('FormEditor', () => {

Composer/cypress/integration/VisualDesigner.spec.js

@@ -1,39 +1,14 @@
 /// <reference types="Cypress" />
 
 context('Visual Designer', () => {
-  beforeEach(() => {
+  before(() => {
     cy.visit(Cypress.env('COMPOSER_URL'));
-    cy.startFromTemplate('EmptyBot', 'VisualDesignerTest');
+    cy.openBot('ToDoBot');
   });
 
-  //will remove skip after add trigger is ok
-  it('can add a rule from the visual designer', () => {
-    cy.addEventHandler('Handle a Dialog Event');
-    cy.wait(100);
-
-    cy.withinEditor('VisualEditor', () => {
-      cy.contains('Handle a Dialog Event').should('exist');
-    });
-
-    cy.addEventHandler('Handle an Intent');
-    cy.wait(100);
-
-    cy.withinEditor('VisualEditor', () => {
-      cy.contains('Handle an Intent').should('exist');
-    });
-
-    cy.addEventHandler('Handle Unknown Intent');
-    cy.wait(100);
-
-    cy.withinEditor('VisualEditor', () => {
-      cy.contains('Handle Unknown Intent').should('exist');
-    });
-
-    cy.addEventHandler('Handle ConversationUpdate');
-    cy.wait(100);
-
+  it('can find Visual Designer default trigger in container', () => {
     cy.withinEditor('VisualEditor', () => {
-      cy.contains('Handle ConversationUpdate').should('exist');
+      cy.getByText('Trigger').should('exist');
     });
   });
 });

Composer/cypress/support/commands.js

@@ -26,7 +26,9 @@ import 'cypress-testing-library/add-commands';
 
 Cypress.Commands.add('openBot', botName => {
   cy.get('[data-testid="LeftNav-CommandBarButtonHome"]').click();
-  cy.getByText('Open').click();
+  cy.get('[data-testid="homePage-ToolBar-Open"]').within(() => {
+    cy.getByText('Open').click();
+  });
   cy.get('[data-testid="SelectLocation"]').within(() => {
     cy.get(`[aria-label="${botName}"]`).click({ force: true });
     cy.wait(500);

Composer/packages/client/src/ShellApi.ts

@@ -67,7 +67,7 @@ const shellNavigator = (shellPage: string, opts: { id?: string } = {}) => {
 export const ShellApi: React.FC = () => {
   const { state, actions } = useContext(StoreContext);
   const { dialogs, schemas, lgFiles, luFiles, designPageLocation, focusPath, breadcrumb } = state;
-  const updateDialog = useDebouncedFunc(actions.updateDialog);
+  const updateDialog = actions.updateDialog;
   const updateLuFile = actions.updateLuFile; //if debounced, error can't pass to form
   const updateLgFile = useDebouncedFunc(actions.updateLgFile);
   const updateLgTemplate = useDebouncedFunc(actions.updateLgTemplate);
@@ -278,12 +278,6 @@ export const ShellApi: React.FC = () => {
     }
   }
 
-  function flushUpdates() {
-    if (updateDialog.flush) {
-      updateDialog.flush();
-    }
-  }
-
   function cleanData() {
     const cleanedData = sanitizeDialogData(dialogsMap[dialogId]);
     if (!isEqual(dialogsMap[dialogId], cleanedData)) {
@@ -293,7 +287,6 @@ export const ShellApi: React.FC = () => {
       };
       updateDialog(payload);
     }
-    flushUpdates();
   }
 
   function navTo({ path }) {

Composer/packages/client/src/extension-container/ExtensionContainer.tsx

@@ -114,6 +114,16 @@ function ExtensionContainer() {
       }
     });
 
+    apiClient.registerApi('rpc', (method, ...params) => {
+      const handler = (window as any)[method];
+      let result;
+      if (handler) {
+        result = handler(...params);
+      }
+
+      return result;
+    });
+
     shellApi.getState().then(result => {
       setShellData(result);
     });