From 544cbe137b0ed3ee58d453384f9652b510d605a3 Mon Sep 17 00:00:00 2001 From: Okan Cetin Date: Sat, 28 Oct 2023 04:09:38 +0300 Subject: [PATCH 1/6] Use default query on adding new tab --- packages/graphiql-react/src/editor/context.tsx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/graphiql-react/src/editor/context.tsx b/packages/graphiql-react/src/editor/context.tsx index 8515cb8c763..667e4565569 100644 --- a/packages/graphiql-react/src/editor/context.tsx +++ b/packages/graphiql-react/src/editor/context.tsx @@ -366,14 +366,20 @@ export function EditorContextProvider(props: EditorContextProviderProps) { headerEditor, responseEditor, }); - const { onTabChange, defaultHeaders, children } = props; + const { onTabChange, defaultHeaders, defaultQuery, children } = props; const addTab = useCallback(() => { setTabState(current => { // Make sure the current tab stores the latest values const updatedValues = synchronizeActiveTabValues(current); const updated = { - tabs: [...updatedValues.tabs, createTab({ headers: defaultHeaders })], + tabs: [ + ...updatedValues.tabs, + createTab({ + headers: defaultHeaders, + query: defaultQuery ?? DEFAULT_QUERY, + }), + ], activeTabIndex: updatedValues.tabs.length, }; storeTabs(updated); From 1f497d3cfc731357014f432adcb207df90709793 Mon Sep 17 00:00:00 2001 From: Okan Cetin Date: Sat, 28 Oct 2023 14:11:56 +0300 Subject: [PATCH 2/6] Fix eslint issue --- packages/graphiql-react/src/editor/context.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/graphiql-react/src/editor/context.tsx b/packages/graphiql-react/src/editor/context.tsx index 667e4565569..ae626cf4162 100644 --- a/packages/graphiql-react/src/editor/context.tsx +++ b/packages/graphiql-react/src/editor/context.tsx @@ -389,6 +389,7 @@ export function EditorContextProvider(props: EditorContextProviderProps) { }); }, [ defaultHeaders, + defaultQuery, onTabChange, setEditorValues, storeTabs, From 94b5645fcfdfaf0d311932e7f4ce887aca41fe48 Mon Sep 17 00:00:00 2001 From: Okan Cetin Date: Mon, 30 Oct 2023 15:32:39 +0300 Subject: [PATCH 3/6] First try to use `query` and `headers` props --- packages/graphiql-react/src/editor/context.tsx | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/packages/graphiql-react/src/editor/context.tsx b/packages/graphiql-react/src/editor/context.tsx index ae626cf4162..93aaac3ccc5 100644 --- a/packages/graphiql-react/src/editor/context.tsx +++ b/packages/graphiql-react/src/editor/context.tsx @@ -366,7 +366,14 @@ export function EditorContextProvider(props: EditorContextProviderProps) { headerEditor, responseEditor, }); - const { onTabChange, defaultHeaders, defaultQuery, children } = props; + const { + onTabChange, + headers, + query, + defaultHeaders, + defaultQuery, + children, + } = props; const addTab = useCallback(() => { setTabState(current => { @@ -376,8 +383,8 @@ export function EditorContextProvider(props: EditorContextProviderProps) { tabs: [ ...updatedValues.tabs, createTab({ - headers: defaultHeaders, - query: defaultQuery ?? DEFAULT_QUERY, + headers: headers ?? defaultHeaders, + query: query ?? defaultQuery ?? DEFAULT_QUERY, }), ], activeTabIndex: updatedValues.tabs.length, @@ -388,6 +395,8 @@ export function EditorContextProvider(props: EditorContextProviderProps) { return updated; }); }, [ + headers, + query, defaultHeaders, defaultQuery, onTabChange, From ef4b1f720be65333def62afd6d55bcf9979b3566 Mon Sep 17 00:00:00 2001 From: Rikki Schulte Date: Sun, 7 Jan 2024 18:09:37 +0100 Subject: [PATCH 4/6] add changeset --- .changeset/brown-tigers-nail.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/brown-tigers-nail.md diff --git a/.changeset/brown-tigers-nail.md b/.changeset/brown-tigers-nail.md new file mode 100644 index 00000000000..cdeb2814f3e --- /dev/null +++ b/.changeset/brown-tigers-nail.md @@ -0,0 +1,6 @@ +--- +"@graphiql/react": patch +"graphiql": patch +--- + +fix: use the default query on adding a new tab From be08c8fa3b81467922efe9fb16bf7270e2da4efe Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Thu, 15 Aug 2024 16:47:04 +0200 Subject: [PATCH 5/6] upd fix lint this should fix cypress fix --- packages/graphiql-react/src/editor/context.tsx | 15 +++------------ packages/graphiql/cypress/e2e/headers.cy.ts | 6 ++++-- packages/graphiql/cypress/e2e/tabs.cy.ts | 2 +- packages/graphiql/resources/renderExample.js | 1 + 4 files changed, 9 insertions(+), 15 deletions(-) diff --git a/packages/graphiql-react/src/editor/context.tsx b/packages/graphiql-react/src/editor/context.tsx index a1a0fed8491..339f84cf03b 100644 --- a/packages/graphiql-react/src/editor/context.tsx +++ b/packages/graphiql-react/src/editor/context.tsx @@ -360,14 +360,7 @@ export function EditorContextProvider(props: EditorContextProviderProps) { headerEditor, responseEditor, }); - const { - onTabChange, - headers, - query, - defaultHeaders, - defaultQuery, - children, - } = props; + const { onTabChange, defaultHeaders, defaultQuery, children } = props; const setEditorValues = useSetEditorValues({ queryEditor, variableEditor, @@ -384,8 +377,8 @@ export function EditorContextProvider(props: EditorContextProviderProps) { tabs: [ ...updatedValues.tabs, createTab({ - headers: headers ?? defaultHeaders, - query: query ?? defaultQuery ?? DEFAULT_QUERY, + headers: defaultHeaders, + query: defaultQuery ?? DEFAULT_QUERY, }), ], activeTabIndex: updatedValues.tabs.length, @@ -396,8 +389,6 @@ export function EditorContextProvider(props: EditorContextProviderProps) { return updated; }); }, [ - headers, - query, defaultHeaders, defaultQuery, onTabChange, diff --git a/packages/graphiql/cypress/e2e/headers.cy.ts b/packages/graphiql/cypress/e2e/headers.cy.ts index da453b052d3..7e4df95b56c 100644 --- a/packages/graphiql/cypress/e2e/headers.cy.ts +++ b/packages/graphiql/cypress/e2e/headers.cy.ts @@ -3,7 +3,9 @@ const DEFAULT_HEADERS = '{"foo":2}'; describe('Headers', () => { describe('`defaultHeaders`', () => { it('should have default headers while open new tabs', () => { - cy.visit(`/?query={test}&defaultHeaders=${DEFAULT_HEADERS}`); + cy.visit( + `/?query={test}&defaultHeaders=${DEFAULT_HEADERS}&defaultQuery=`, + ); cy.assertHasValues({ query: '{test}', headersString: DEFAULT_HEADERS }); cy.get('.graphiql-tab-add').click(); cy.assertHasValues({ query: '', headersString: DEFAULT_HEADERS }); @@ -14,7 +16,7 @@ describe('Headers', () => { it('in case `headers` and `defaultHeaders` are set, `headers` should be on 1st tab and `defaultHeaders` for other opened tabs', () => { const HEADERS = '{"bar":true}'; cy.visit( - `/?query={test}&defaultHeaders=${DEFAULT_HEADERS}&headers=${HEADERS}`, + `/?query={test}&defaultHeaders=${DEFAULT_HEADERS}&headers=${HEADERS}&defaultQuery=`, ); cy.assertHasValues({ query: '{test}', headersString: HEADERS }); cy.get('.graphiql-tab-add').click(); diff --git a/packages/graphiql/cypress/e2e/tabs.cy.ts b/packages/graphiql/cypress/e2e/tabs.cy.ts index 13cdba3f066..007bd2d5ded 100644 --- a/packages/graphiql/cypress/e2e/tabs.cy.ts +++ b/packages/graphiql/cypress/e2e/tabs.cy.ts @@ -1,6 +1,6 @@ describe('Tabs', () => { it('Should store editor contents when switching between tabs', () => { - cy.visit('/?query='); + cy.visit('/?defaultQuery=&query='); // Assert that no tab visible when there's only one session cy.get('#graphiql-session-tab-0').should('not.exist'); diff --git a/packages/graphiql/resources/renderExample.js b/packages/graphiql/resources/renderExample.js index 208d6accc2d..b3276303ddb 100644 --- a/packages/graphiql/resources/renderExample.js +++ b/packages/graphiql/resources/renderExample.js @@ -94,5 +94,6 @@ root.render( parameters.confirmCloseTab === 'true' ? confirmCloseTab : undefined, onTabChange, forcedTheme: parameters.forcedTheme, + defaultQuery: parameters.defaultQuery, }), ); From a75583ed551499050576d821f46b8d64131c4541 Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Thu, 15 Aug 2024 17:16:53 +0200 Subject: [PATCH 6/6] Update .changeset/brown-tigers-nail.md --- .changeset/brown-tigers-nail.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/.changeset/brown-tigers-nail.md b/.changeset/brown-tigers-nail.md index cdeb2814f3e..11760a5b607 100644 --- a/.changeset/brown-tigers-nail.md +++ b/.changeset/brown-tigers-nail.md @@ -3,4 +3,14 @@ "graphiql": patch --- -fix: use the default query on adding a new tab +fix: set query editor to `defaultQuery` while adding a new tab or GraphiQL's default query + +```graphql +# Welcome to GraphiQL +# +# GraphiQL is an in-browser tool for writing, validating, and +# testing GraphQL queries. + +... +``` +