refactor(laboratory): rename preflight-script to just preflight (#6470)

graphql-hive · Feb 5, 2025 · 4c25505 · 4c25505
1 parent 9eeaf7a
commit 4c25505
Show file tree

Hide file tree

Showing 10 changed files with 165 additions and 168 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -2,7 +2,10 @@
   "search.exclude": {
     "**/dist": true,
     "**/pnpm-lock.yaml": true,
-    "**/*.tsbuildinfo": true
+    "**/*.tsbuildinfo": true,
+    "**/*.next": true,
+    "**/*.turbo": true,
+    "**/web/docs/out": true
   },
   "commands.commands": [
     {

diff --git a/...ess/e2e/laboratory-preflight-script.cy.ts → cypress/e2e/laboratory-preflight.cy.ts b/...ess/e2e/laboratory-preflight-script.cy.ts → cypress/e2e/laboratory-preflight.cy.ts
@@ -1,9 +1,9 @@
 import { dedent } from '../support/testkit';
 
 const selectors = {
-  buttonPreflightScript: '[aria-label*="Preflight Script"]',
-  buttonModalCy: 'preflight-script-modal-button',
-  buttonToggleCy: 'toggle-preflight-script',
+  buttonGraphiQLPreflight: '[aria-label*="Preflight Script"]',
+  buttonModalCy: 'preflight-modal-button',
+  buttonToggleCy: 'toggle-preflight',
   buttonHeaders: '[data-name="headers"]',
   headersEditor: {
     textArea: '.graphiql-editor-tool .graphiql-editor:last-child textarea',
@@ -13,7 +13,7 @@ const selectors = {
   },
 
   modal: {
-    buttonSubmitCy: 'preflight-script-modal-submit',
+    buttonSubmitCy: 'preflight-modal-submit',
   },
 };
 
@@ -27,7 +27,7 @@ beforeEach(() => {
       cy.setCookie('sRefreshToken', refreshToken);
       data.slug = slug;
       cy.visit(`/${slug}/laboratory`);
-      cy.get(selectors.buttonPreflightScript).click();
+      cy.get(selectors.buttonGraphiQLPreflight).click();
     });
   });
 });
@@ -52,30 +52,27 @@ function setMonacoEditorContents(editorCyName: string, text: string) {
 }
 
 function setEditorScript(script: string) {
-  setMonacoEditorContents('preflight-script-editor', script);
+  setMonacoEditorContents('preflight-editor', script);
 }
 
 describe('Laboratory > Preflight Script', () => {
   // https://github.com/graphql-hive/console/pull/6450
   it('regression: loads even if local storage is set to {}', () => {
     window.localStorage.setItem('hive:laboratory:environment', '{}');
     cy.visit(`/${data.slug}/laboratory`);
-    cy.get(selectors.buttonPreflightScript).click();
+    cy.get(selectors.buttonGraphiQLPreflight).click();
   });
   it('mini script editor is read only', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
     // Wait loading disappears
-    cy.dataCy('preflight-script-editor-mini').should('not.contain', 'Loading');
+    cy.dataCy('preflight-editor-mini').should('not.contain', 'Loading');
     // Click
-    cy.dataCy('preflight-script-editor-mini').click();
+    cy.dataCy('preflight-editor-mini').click();
     // And type
-    cy.dataCy('preflight-script-editor-mini').within(() => {
+    cy.dataCy('preflight-editor-mini').within(() => {
       cy.get('textarea').type('🐝', { force: true });
     });
-    cy.dataCy('preflight-script-editor-mini').should(
-      'have.text',
-      'Cannot edit in read-only editor',
-    );
+    cy.dataCy('preflight-editor-mini').should('have.text', 'Cannot edit in read-only editor');
   });
 });
 
@@ -84,25 +81,25 @@ describe('Preflight Script Modal', () => {
   const env = '{"foo":123}';
 
   beforeEach(() => {
-    cy.dataCy('preflight-script-modal-button').click();
+    cy.dataCy('preflight-modal-button').click();
     setMonacoEditorContents('env-editor', env);
   });
 
   it('save script and environment variables when submitting', () => {
     setEditorScript(script);
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
     cy.dataCy('env-editor-mini').should('have.text', env);
-    cy.dataCy('toggle-preflight-script').click();
-    cy.dataCy('preflight-script-editor-mini').should('have.text', script);
+    cy.dataCy('toggle-preflight').click();
+    cy.dataCy('preflight-editor-mini').should('have.text', script);
     cy.reload();
     cy.get('[aria-label*="Preflight Script"]').click();
     cy.dataCy('env-editor-mini').should('have.text', env);
-    cy.dataCy('preflight-script-editor-mini').should('have.text', script);
+    cy.dataCy('preflight-editor-mini').should('have.text', script);
   });
 
   it('logs show console/error information', () => {
     setEditorScript(script);
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('console-output').should('contain', 'log: Hello_world (1:1)');
 
     setEditorScript(
@@ -112,7 +109,7 @@ console.error('Fatal')
 throw new TypeError('Test')`,
     );
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     // First log previous log message
     cy.dataCy('console-output').should('contain', 'log: Hello_world (1:1)');
     // After the new logs
@@ -125,7 +122,7 @@ throw new TypeError('Test')`,
   it('prompt and pass the awaited response', () => {
     setEditorScript(script);
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('console-output').should('contain', 'log: Hello_world (1:1)');
 
     setEditorScript(
@@ -135,7 +132,7 @@ throw new TypeError('Test')`,
       `,
     );
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('prompt').get('input').type('test-username');
     cy.dataCy('prompt').get('form').submit();
 
@@ -153,7 +150,7 @@ throw new TypeError('Test')`,
   it('prompt and cancel', () => {
     setEditorScript(script);
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('console-output').should('contain', 'log: Hello_world (1:1)');
 
     setEditorScript(
@@ -163,7 +160,7 @@ throw new TypeError('Test')`,
       `,
     );
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('prompt').get('input').type('test-username');
     cy.dataCy('prompt').get('[data-cy="prompt-cancel"]').click();
 
@@ -181,7 +178,7 @@ throw new TypeError('Test')`,
   it('script execution updates environment variables', () => {
     setEditorScript(`lab.environment.set('my-test', "TROLOLOL")`);
 
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('env-editor').should(
       'include.text',
       // replace space with &nbsp;
@@ -191,7 +188,7 @@ throw new TypeError('Test')`,
 
   it('`crypto-js` can be used for generating hashes', () => {
     setEditorScript('console.log(lab.CryptoJS.SHA256("🐝"))');
-    cy.dataCy('run-preflight-script').click();
+    cy.dataCy('run-preflight').click();
     cy.dataCy('console-output').should('contain', 'info: Using crypto-js version:');
     cy.dataCy('console-output').should(
       'contain',
@@ -201,13 +198,13 @@ throw new TypeError('Test')`,
 
   it('scripts can not use `eval`', () => {
     setEditorScript('eval()');
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
     cy.get('body').contains('Usage of dangerous statement like eval() or Function("").');
   });
 
   it('invalid code is rejected and can not be saved', () => {
     setEditorScript('🐝');
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
     cy.get('body').contains("[1:1]: Illegal character '}");
   });
 });
@@ -289,7 +286,7 @@ describe('Execution', () => {
   });
 
   it('header placeholders are substituted with environment variables', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
     cy.get('[data-name="headers"]').click();
     cy.get('.graphiql-editor-tool .graphiql-editor:last-child textarea').type(
       '{ "__test": "{{foo}} bar {{nonExist}}" }',
@@ -316,7 +313,7 @@ describe('Execution', () => {
   });
 
   it('executed script updates update env editor and substitute headers', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
     cy.get('[data-name="headers"]').click();
     cy.get('.graphiql-editor-tool .graphiql-editor:last-child textarea').type(
       '{ "__test": "{{foo}}" }',
@@ -325,9 +322,9 @@ describe('Execution', () => {
         parseSpecialCharSequences: false,
       },
     );
-    cy.dataCy('preflight-script-modal-button').click();
-    setMonacoEditorContents('preflight-script-editor', `lab.environment.set('foo', '92')`);
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-button').click();
+    setMonacoEditorContents('preflight-editor', `lab.environment.set('foo', '92')`);
+    cy.dataCy('preflight-modal-submit').click();
 
     cy.intercept({
       method: 'POST',
@@ -340,7 +337,7 @@ describe('Execution', () => {
   });
 
   it('execute, prompt and use it in headers', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
 
     cy.get('[data-name="headers"]').click();
     cy.get('[data-name="headers"]').click();
@@ -352,15 +349,15 @@ describe('Execution', () => {
       },
     );
 
-    cy.dataCy('preflight-script-modal-button').click();
+    cy.dataCy('preflight-modal-button').click();
     setMonacoEditorContents(
-      'preflight-script-editor',
+      'preflight-editor',
       dedent`
       const username = await lab.prompt('Enter your username');
       lab.environment.set('username', username);
     `,
     );
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
 
     cy.intercept({
       method: 'POST',
@@ -385,11 +382,11 @@ describe('Execution', () => {
         parseSpecialCharSequences: false,
       },
     );
-    cy.dataCy('preflight-script-modal-button').click();
-    setMonacoEditorContents('preflight-script-editor', `lab.environment.set('foo', 92)`);
+    cy.dataCy('preflight-modal-button').click();
+    setMonacoEditorContents('preflight-editor', `lab.environment.set('foo', 92)`);
     setMonacoEditorContents('env-editor', `{"foo":10}`);
 
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
 
     cy.intercept({
       method: 'POST',
@@ -402,38 +399,38 @@ describe('Execution', () => {
   });
 
   it('logs are visible when opened', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
 
-    cy.dataCy('preflight-script-modal-button').click();
+    cy.dataCy('preflight-modal-button').click();
     setMonacoEditorContents(
-      'preflight-script-editor',
+      'preflight-editor',
       dedent`
         console.info(1)
         console.warn(true)
         console.error('Fatal')
         throw new TypeError('Test')
         `,
     );
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
 
     cy.intercept({
       method: 'POST',
     }).as('post');
 
     // shows no logs before executing
-    cy.get('#preflight-script-logs button[data-cy="trigger"]').click({
+    cy.get('#preflight-logs button[data-cy="trigger"]').click({
       // it's because the button is not fully visible on the screen
       force: true,
     });
-    cy.get('#preflight-script-logs [data-cy="logs"]').should(
+    cy.get('#preflight-logs [data-cy="logs"]').should(
       'contain',
       ['No logs available', 'Execute a query to see logs'].join(''),
     );
 
     cy.get('.graphiql-execute-button').click();
     cy.wait('@post');
 
-    cy.get('#preflight-script-logs [data-cy="logs"]').should(
+    cy.get('#preflight-logs [data-cy="logs"]').should(
       'contain',
       [
         'log: Running script...',
@@ -447,19 +444,19 @@ describe('Execution', () => {
   });
 
   it('logs are cleared when requested', () => {
-    cy.dataCy('toggle-preflight-script').click();
+    cy.dataCy('toggle-preflight').click();
 
-    cy.dataCy('preflight-script-modal-button').click();
+    cy.dataCy('preflight-modal-button').click();
     setMonacoEditorContents(
-      'preflight-script-editor',
+      'preflight-editor',
       dedent`
         console.info(1)
         console.warn(true)
         console.error('Fatal')
         throw new TypeError('Test')
         `,
     );
-    cy.dataCy('preflight-script-modal-submit').click();
+    cy.dataCy('preflight-modal-submit').click();
 
     cy.intercept({
       method: 'POST',
@@ -468,12 +465,12 @@ describe('Execution', () => {
     cy.wait('@post');
 
     // open logs
-    cy.get('#preflight-script-logs button[data-cy="trigger"]').click({
+    cy.get('#preflight-logs button[data-cy="trigger"]').click({
       // it's because the button is not fully visible on the screen
       force: true,
     });
 
-    cy.get('#preflight-script-logs [data-cy="logs"]').should(
+    cy.get('#preflight-logs [data-cy="logs"]').should(
       'contain',
       [
         'log: Running script...',
@@ -485,8 +482,8 @@ describe('Execution', () => {
       ].join(''),
     );
 
-    cy.get('#preflight-script-logs button[data-cy="erase-logs"]').click();
-    cy.get('#preflight-script-logs [data-cy="logs"]').should(
+    cy.get('#preflight-logs button[data-cy="erase-logs"]').click();
+    cy.get('#preflight-logs [data-cy="logs"]').should(
       'contain',
       ['No logs available', 'Execute a query to see logs'].join(''),
     );

diff --git a/packages/web/app/preflight-worker-embed.html b/packages/web/app/preflight-worker-embed.html
@@ -8,6 +8,6 @@
     <a href="https://www.youtube.com/watch?v=CMNry4PE93Y" rel="nofollow">I like turtles</a>
     <a href="https://www.youtube.com/watch?v=XOi2jFIhZhA" rel="nofollow">Wheatherboi</a>
 
-    <script type="module" src="./src/lib/preflight-sandbox/preflight-worker-embed.ts"></script>
+    <script type="module" src="./src/lib/preflight/preflight-worker-embed.ts"></script>
   </body>
 </html>
diff --git a/.../lib/preflight-sandbox/allowed-globals.ts → .../app/src/lib/preflight/allowed-globals.ts b/.../lib/preflight-sandbox/allowed-globals.ts → .../app/src/lib/preflight/allowed-globals.ts