Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Merged
merged 11 commits into from
Feb 5, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -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": [
{
Expand Down
Original file line number Diff line number Diff line change
@@ -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',
Expand All @@ -13,7 +13,7 @@ const selectors = {
},

modal: {
buttonSubmitCy: 'preflight-script-modal-submit',
buttonSubmitCy: 'preflight-modal-submit',
},
};

Expand All @@ -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();
});
});
});
Expand All @@ -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');
});
});

Expand All @@ -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(
Expand All @@ -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
Expand All @@ -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(
Expand All @@ -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();

Expand All @@ -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(
Expand All @@ -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();

Expand All @@ -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  
Expand All @@ -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',
Expand All @@ -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 '}");
});
});
Expand Down Expand Up @@ -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}}" }',
Expand All @@ -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}}" }',
Expand All @@ -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',
Expand All @@ -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();
Expand All @@ -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',
Expand All @@ -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',
Expand All @@ -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...',
Expand All @@ -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',
Expand All @@ -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...',
Expand All @@ -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(''),
);
Expand Down
2 changes: 1 addition & 1 deletion packages/web/app/preflight-worker-embed.html
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Loading
Loading