forked from appsmithorg/appsmith
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Added warning message in response pane while prepared statement…
… is on (appsmithorg#36407) ## Description Added warning message in response pane to show that use prepared statement is turned on. This will be showing up only if there is an error. Fixes appsmithorg#36326 ## Automation /ok-to-test tags="@tag.Sanity, @tag.Datasource" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/10987691166> > Commit: debc9f3 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10987691166&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Sanity, @tag.Datasource` > Spec: > <hr>Mon, 23 Sep 2024 05:25:23 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a warning message for users regarding prepared statements that may cause query errors. - Added a mechanism to navigate users to the settings page for resolving issues related to prepared statements. - Enhanced the Query Response Tab with contextual warnings and improved user guidance. - **Bug Fixes** - Improved error handling related to prepared statements in the query response. - **Tests** - Added comprehensive unit tests for the Query Response Tab to ensure correct behavior of the prepared statement warning under various conditions. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Loading branch information
1 parent
8aaaeac
commit f285638
Showing
3 changed files
with
287 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
235 changes: 235 additions & 0 deletions
235
app/client/src/pages/Editor/QueryEditor/QueryResponseTab.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,235 @@ | ||
import React from "react"; | ||
import { render } from "@testing-library/react"; | ||
import { Provider } from "react-redux"; | ||
import configureStore from "redux-mock-store"; | ||
import QueryResponseTab from "./QueryResponseTab"; | ||
import { ENTITY_TYPE } from "ee/entities/AppsmithConsole/utils"; | ||
import type { Action } from "entities/Action"; | ||
import { unitTestBaseMockStore } from "layoutSystems/common/dropTarget/unitTestUtils"; | ||
import { EditorViewMode } from "ee/entities/IDE/constants"; | ||
import { lightTheme } from "selectors/themeSelectors"; | ||
import { ThemeProvider } from "styled-components"; | ||
import { BrowserRouter as Router } from "react-router-dom"; | ||
|
||
// Mock store | ||
const mockStore = configureStore([]); | ||
|
||
const defaultProps = { | ||
actionName: "Test Action", | ||
actionSource: { | ||
name: "test source", | ||
id: "test-source-id", | ||
type: ENTITY_TYPE.ACTION, | ||
}, | ||
currentActionConfig: { | ||
id: "test-action-id", | ||
name: "Test Action", | ||
actionConfiguration: { pluginSpecifiedTemplates: [{ value: true }] }, | ||
userPermissions: ["execute"], | ||
} as Action, | ||
isRunning: false, | ||
onRunClick: jest.fn(), | ||
runErrorMessage: "", | ||
}; | ||
|
||
const storeData = { | ||
...unitTestBaseMockStore, | ||
evaluations: { | ||
tree: {}, | ||
}, | ||
entities: { | ||
plugins: { | ||
list: [], | ||
}, | ||
datasources: { | ||
structure: {}, | ||
}, | ||
}, | ||
ui: { | ||
...unitTestBaseMockStore.ui, | ||
users: { | ||
featureFlag: { | ||
data: {}, | ||
overriddenFlags: {}, | ||
}, | ||
}, | ||
ide: { | ||
view: EditorViewMode.FullScreen, | ||
}, | ||
debugger: { | ||
context: { | ||
errorCount: 0, | ||
}, | ||
}, | ||
queryPane: { | ||
debugger: { | ||
open: true, | ||
responseTabHeight: 200, | ||
selectedTab: "response", | ||
}, | ||
}, | ||
}, | ||
}; | ||
|
||
describe("QueryResponseTab", () => { | ||
// eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
let store: any; | ||
|
||
beforeEach(() => { | ||
store = mockStore(storeData); | ||
}); | ||
|
||
/** Test use prepared statement warning **/ | ||
it("1. Prepared statement warning should not be showing", () => { | ||
const { container } = render( | ||
<Provider store={store}> | ||
<ThemeProvider theme={lightTheme}> | ||
<Router> | ||
<QueryResponseTab {...defaultProps} /> | ||
</Router> | ||
</ThemeProvider> | ||
</Provider>, | ||
); | ||
|
||
// Check if the prepared statement warning is not showing | ||
expect( | ||
container.querySelector("[data-testid='t--prepared-statement-warning']"), | ||
).toBeNull(); | ||
}); | ||
|
||
it("2. Check if prepared statement warning is not showing while running the query", () => { | ||
const { container } = render( | ||
<Provider store={store}> | ||
<ThemeProvider theme={lightTheme}> | ||
<Router> | ||
<QueryResponseTab {...defaultProps} isRunning /> | ||
</Router> | ||
</ThemeProvider> | ||
</Provider>, | ||
); | ||
|
||
// Check if the prepared statement warning is showing | ||
expect( | ||
container.querySelector("[data-testid='t--prepared-statement-warning']"), | ||
).toBeNull(); | ||
}); | ||
|
||
it("3. Check if prepared statement warning is not showing when run is successful", () => { | ||
store = mockStore({ | ||
...storeData, | ||
entities: { | ||
...storeData.entities, | ||
actions: [ | ||
{ | ||
config: { | ||
id: "test-action-id", | ||
name: "Test Action", | ||
}, | ||
isLoading: false, | ||
data: { | ||
body: [{ key: "value" }], | ||
isExecutionSuccess: true, | ||
}, | ||
}, | ||
], | ||
}, | ||
}); | ||
|
||
const { container } = render( | ||
<Provider store={store}> | ||
<ThemeProvider theme={lightTheme}> | ||
<Router> | ||
<QueryResponseTab {...defaultProps} /> | ||
</Router> | ||
</ThemeProvider> | ||
</Provider>, | ||
); | ||
|
||
// Check if the prepared statement warning is showing | ||
expect( | ||
container.querySelector("[data-testid='t--prepared-statement-warning']"), | ||
).toBeNull(); | ||
}); | ||
|
||
it("4. Check if prepared statement warning is showing when run is failed", () => { | ||
store = mockStore({ | ||
...storeData, | ||
entities: { | ||
...storeData.entities, | ||
actions: [ | ||
{ | ||
config: { | ||
id: "test-action-id", | ||
name: "Test Action", | ||
}, | ||
isLoading: false, | ||
data: { | ||
body: "ERROR: relation 'userssss' does not exist Position: 15", | ||
isExecutionSuccess: false, | ||
}, | ||
}, | ||
], | ||
}, | ||
}); | ||
|
||
const { container } = render( | ||
<Provider store={store}> | ||
<ThemeProvider theme={lightTheme}> | ||
<Router> | ||
<QueryResponseTab {...defaultProps} /> | ||
</Router> | ||
</ThemeProvider> | ||
</Provider>, | ||
); | ||
|
||
// Check if the prepared statement warning is showing | ||
expect( | ||
container.querySelector("[data-testid='t--prepared-statement-warning']"), | ||
).not.toBeNull(); | ||
}); | ||
|
||
it("5. Check if prepared statement warning is not showing when prepared statement is turned off", () => { | ||
store = mockStore({ | ||
...storeData, | ||
entities: { | ||
...storeData.entities, | ||
actions: [ | ||
{ | ||
config: { | ||
id: "test-action-id", | ||
name: "Test Action", | ||
}, | ||
isLoading: false, | ||
data: { | ||
body: "ERROR: relation 'userssss' does not exist Position: 15", | ||
isExecutionSuccess: false, | ||
}, | ||
}, | ||
], | ||
}, | ||
}); | ||
|
||
const props = { | ||
...defaultProps, | ||
currentActionConfig: { | ||
...defaultProps.currentActionConfig, | ||
actionConfiguration: { pluginSpecifiedTemplates: [{ value: false }] }, | ||
} as Action, | ||
}; | ||
|
||
const { container } = render( | ||
<Provider store={store}> | ||
<ThemeProvider theme={lightTheme}> | ||
<Router> | ||
<QueryResponseTab {...props} /> | ||
</Router> | ||
</ThemeProvider> | ||
</Provider>, | ||
); | ||
|
||
// Check if the prepared statement warning is showing | ||
expect( | ||
container.querySelector("[data-testid='t--prepared-statement-warning']"), | ||
).toBeNull(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters