-
Notifications
You must be signed in to change notification settings - Fork 298
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
First e2e tests for plugin initialization (#4465)
# What this PR does - Fix extension (IRM settings) to work with backend proxy approach - Create e2e tests that verifies that newly created users can use OnCall / OnCall extensions right away without any action from the Admin - Create an initial draft for plugin configuration page - More cleanup <!-- *Note*: if you have more than one GitHub issue that this PR closes, be sure to preface each issue link with a [closing keyword](https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/using-keywords-in-issues-and-pull-requests#linking-a-pull-request-to-an-issue). This ensures that the issue(s) are auto-closed once the PR has been merged. --> ## Checklist - [x] Unit, integration, and e2e (if applicable) tests updated - [x] Documentation added (or `pr:no public docs` PR label added if not required) - [ ] Added the relevant release notes label (see labels prefixed w/ `release:`). These labels dictate how your PR will show up in the autogenerated release notes.
- Loading branch information
Showing
22 changed files
with
300 additions
and
85 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
15 changes: 15 additions & 0 deletions
15
grafana-plugin/e2e-tests/pluginInitialization/configuration.test.ts
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,15 @@ | ||
import { PLUGIN_ID } from 'utils/consts'; | ||
|
||
import { test, expect } from '../fixtures'; | ||
import { goToGrafanaPage } from '../utils/navigation'; | ||
|
||
test.describe('Plugin configuration', () => { | ||
test('Admin user can see currently applied URL', async ({ adminRolePage: { page } }) => { | ||
const urlInput = page.getByTestId('oncall-api-url-input'); | ||
|
||
await goToGrafanaPage(page, `/plugins/${PLUGIN_ID}`); | ||
const currentlyAppliedURL = await urlInput.inputValue(); | ||
|
||
expect(currentlyAppliedURL).toBe('http://oncall-dev-engine:8080'); | ||
}); | ||
}); |
67 changes: 67 additions & 0 deletions
67
grafana-plugin/e2e-tests/pluginInitialization/initialization.test.ts
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,67 @@ | ||
import { test, expect } from '../fixtures'; | ||
import { OrgRole } from '../utils/constants'; | ||
import { goToGrafanaPage, goToOnCallPage } from '../utils/navigation'; | ||
import { createGrafanaUser, loginAndWaitTillGrafanaIsLoaded } from '../utils/users'; | ||
|
||
test.describe('Plugin initialization', () => { | ||
test('Plugin OnCall pages work for new viewer user right away', async ({ adminRolePage: { page }, browser }) => { | ||
// Create new viewer user and login as new user | ||
const USER_NAME = `viewer-${new Date().getTime()}`; | ||
await createGrafanaUser({ page, username: USER_NAME, role: OrgRole.Viewer }); | ||
|
||
// Create new browser context to act as new user | ||
const viewerUserContext = await browser.newContext(); | ||
const viewerUserPage = await viewerUserContext.newPage(); | ||
|
||
await loginAndWaitTillGrafanaIsLoaded({ page: viewerUserPage, username: USER_NAME }); | ||
|
||
// Start watching for HTTP responses | ||
const networkResponseStatuses: number[] = []; | ||
viewerUserPage.on('requestfinished', async (request) => | ||
networkResponseStatuses.push((await request.response()).status()) | ||
); | ||
|
||
// Go to OnCall and assert that none of the requests failed | ||
await goToOnCallPage(viewerUserPage, 'alert-groups'); | ||
await viewerUserPage.waitForLoadState('networkidle'); | ||
const numberOfFailedRequests = networkResponseStatuses.filter( | ||
(status) => !(`${status}`.startsWith('2') || `${status}`.startsWith('3')) | ||
).length; | ||
expect(numberOfFailedRequests).toBeLessThanOrEqual(1); // we allow /status request to fail once so plugin is reinstalled | ||
}); | ||
|
||
test('Extension registered by OnCall plugin works for new editor user right away', async ({ | ||
adminRolePage: { page }, | ||
browser, | ||
}) => { | ||
// Create new editor user | ||
const USER_NAME = `editor-${new Date().getTime()}`; | ||
await createGrafanaUser({ page, username: USER_NAME, role: OrgRole.Editor }); | ||
await page.waitForLoadState('networkidle'); | ||
|
||
// Create new browser context to act as new user | ||
const editorUserContext = await browser.newContext(); | ||
const editorUserPage = await editorUserContext.newPage(); | ||
|
||
await loginAndWaitTillGrafanaIsLoaded({ page: editorUserPage, username: USER_NAME }); | ||
|
||
// Start watching for HTTP responses | ||
const networkResponseStatuses: number[] = []; | ||
editorUserPage.on('requestfinished', async (request) => | ||
networkResponseStatuses.push((await request.response()).status()) | ||
); | ||
|
||
// Go to profile -> IRM tab where OnCall plugin extension is registered and assert that none of the requests failed | ||
await goToGrafanaPage(editorUserPage, '/profile?tab=irm'); | ||
await editorUserPage.waitForLoadState('networkidle'); | ||
const numberOfFailedRequests = networkResponseStatuses.filter( | ||
(status) => !(`${status}`.startsWith('2') || `${status}`.startsWith('3')) | ||
).length; | ||
expect(numberOfFailedRequests).toBeLessThanOrEqual(1); // we allow /status request to fail once so plugin is reinstalled | ||
|
||
// ...as well as that user sees content of the extension | ||
const extensionContentText = editorUserPage.getByText('Please connect Grafana Cloud OnCall to use the mobile app'); | ||
await extensionContentText.waitFor(); | ||
await expect(extensionContentText).toBeVisible(); | ||
}); | ||
}); |
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
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
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
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
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
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
53 changes: 52 additions & 1 deletion
53
grafana-plugin/src/containers/PluginConfigPage/PluginConfigPage.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 |
---|---|---|
@@ -1,3 +1,54 @@ | ||
import React from 'react'; | ||
|
||
export const PluginConfigPage = () => <>plugin config page</>; | ||
import { PluginConfigPageProps, PluginMeta } from '@grafana/data'; | ||
import { config } from '@grafana/runtime'; | ||
import { Field, HorizontalGroup, Input } from '@grafana/ui'; | ||
import { observer } from 'mobx-react-lite'; | ||
import { Controller, useForm } from 'react-hook-form'; | ||
import { OnCallPluginMetaJSONData } from 'types'; | ||
|
||
import { Button } from 'components/Button/Button'; | ||
import { getOnCallApiUrl } from 'utils/consts'; | ||
import { validateURL } from 'utils/string'; | ||
|
||
type PluginConfigFormValues = { | ||
onCallApiUrl: string; | ||
}; | ||
|
||
export const PluginConfigPage = observer((props: PluginConfigPageProps<PluginMeta<OnCallPluginMetaJSONData>>) => { | ||
const { handleSubmit, control, formState } = useForm<PluginConfigFormValues>({ | ||
mode: 'onChange', | ||
defaultValues: { onCallApiUrl: getOnCallApiUrl(props.plugin.meta) }, | ||
}); | ||
|
||
const onSubmit = (values: PluginConfigFormValues) => { | ||
// eslint-disable-next-line no-console | ||
console.log(values); | ||
}; | ||
|
||
return ( | ||
<form onSubmit={handleSubmit(onSubmit)}> | ||
<Controller | ||
name={'onCallApiUrl'} | ||
control={control} | ||
rules={{ required: 'OnCall API URL is required', validate: validateURL }} | ||
render={({ field }) => ( | ||
<Field | ||
key={'Name'} | ||
label={'OnCall API URL'} | ||
invalid={Boolean(formState.errors.onCallApiUrl)} | ||
error={formState.errors.onCallApiUrl?.message} | ||
> | ||
<Input {...field} placeholder={'OnCall API URL'} data-testid="oncall-api-url-input" /> | ||
</Field> | ||
)} | ||
/> | ||
<HorizontalGroup> | ||
<Button type="submit" disabled={!formState.isValid}> | ||
Test & Save connection | ||
</Button> | ||
{config.featureToggles.externalServiceAccounts && <Button variant="secondary">Recreate service account</Button>} | ||
</HorizontalGroup> | ||
</form> | ||
); | ||
}); |
Oops, something went wrong.