@ -1,44 +1,31 @@
import { render as rtlRender , screen } from '@testing-library/react' ;
import { Chance } from 'chance' ;
import { http , HttpResponse } from 'msw' ;
import { SetupServer , setupServer } from 'msw/node' ;
import { useParams } from 'react-router-dom-v5-compat' ;
import { TestProvider } from 'test/helpers/TestProvider' ;
import { screen } from '@testing-library/react' ;
import { render } from 'test/test-utils' ;
import { config } from '@grafana/runtime' ;
import { contextSrv } from 'app/core/core' ;
import { backendSrv } from 'app/core/services/backend_srv' ;
import { setupMswServer } from 'app/features/alerting/unified/mockApi' ;
import { rulerTestDb } from '../alerting/unified/mocks/grafanaRulerApi' ;
import { alertingFactory } from '../alerting/unified/mocks/server/db' ;
import { DEFAULT_FOLDERS } from '../alerting/unified/mocks/server/handlers/folders' ;
import BrowseFolderAlertingPage from './BrowseFolderAlertingPage' ;
import { getPrometheusRulesResponse , getRulerRulesResponse } from './fixtures/alertRules.fixture' ;
import * as permissions from './permissions' ;
function render ( . . . [ ui , options ] : Parameters < typeof rtlRender > ) {
rtlRender ( < TestProvider > { ui } < / TestProvider > , options ) ;
}
jest . mock ( '@grafana/runtime' , ( ) = > ( {
. . . jest . requireActual ( '@grafana/runtime' ) ,
getBackendSrv : ( ) = > backendSrv ,
config : {
. . . jest . requireActual ( '@grafana/runtime' ) . config ,
unifiedAlertingEnabled : true ,
} ,
} ) ) ;
// Use the folder and rules from the mocks
const folder = DEFAULT_FOLDERS [ 0 ] ;
const { uid : folderUid , title : folderTitle } = folder ;
jest . mock ( 'react-router-dom-v5-compat' , ( ) = > ( {
. . . jest . requireActual ( 'react-router-dom-v5-compat' ) ,
useParams : jest.fn ( ) ,
useParams : jest.fn ( ( ) = > ( { uid : folderUid } ) ) ,
} ) ) ;
const mockFolderName = 'myFolder' ;
const mockFolderUid = '12345' ;
const random = Chance ( 1 ) ;
const rule_uid = random . guid ( ) ;
const mockRulerRulesResponse = getRulerRulesResponse ( mockFolderName , mockFolderUid , rule_uid ) ;
const mockPrometheusRulesResponse = getPrometheusRulesResponse ( mockFolderName , mockFolderUid , rule_uid ) ;
config . unifiedAlertingEnabled = true ;
setupMswServer ( ) ;
describe ( 'browse-dashboards BrowseFolderAlertingPage' , ( ) = > {
( useParams as jest . Mock ) . mockReturnValue ( { uid : mockFolderUid } ) ;
let server : SetupServer ;
const mockPermissions = {
canCreateDashboards : true ,
canEditDashboards : true ,
@ -49,28 +36,6 @@ describe('browse-dashboards BrowseFolderAlertingPage', () => {
canSetPermissions : true ,
} ;
beforeAll ( ( ) = > {
server = setupServer (
http . get ( '/api/folders/:uid' , ( ) = > {
return HttpResponse . json ( {
title : mockFolderName ,
uid : mockFolderUid ,
} ) ;
} ) ,
http . get ( 'api/ruler/grafana/api/v1/rules' , ( ) = > {
return HttpResponse . json ( mockRulerRulesResponse ) ;
} ) ,
http . get ( 'api/prometheus/grafana/api/v1/rules' , ( ) = > {
return HttpResponse . json ( mockPrometheusRulesResponse ) ;
} )
) ;
server . listen ( ) ;
} ) ;
afterAll ( ( ) = > {
server . close ( ) ;
} ) ;
beforeEach ( ( ) = > {
jest . spyOn ( permissions , 'getFolderPermissions' ) . mockImplementation ( ( ) = > mockPermissions ) ;
jest . spyOn ( contextSrv , 'hasPermission' ) . mockReturnValue ( true ) ;
@ -78,12 +43,11 @@ describe('browse-dashboards BrowseFolderAlertingPage', () => {
afterEach ( ( ) = > {
jest . restoreAllMocks ( ) ;
server . resetHandlers ( ) ;
} ) ;
it ( 'displays the folder title' , async ( ) = > {
render ( < BrowseFolderAlertingPage / > ) ;
expect ( await screen . findByRole ( 'heading' , { name : mockFolderNam e } ) ) . toBeInTheDocument ( ) ;
expect ( await screen . findByRole ( 'heading' , { name : folderTitl e } ) ) . toBeInTheDocument ( ) ;
} ) ;
it ( 'displays the "Folder actions" button' , async ( ) = > {
@ -102,7 +66,7 @@ describe('browse-dashboards BrowseFolderAlertingPage', () => {
} ;
} ) ;
render ( < BrowseFolderAlertingPage / > ) ;
expect ( await screen . findByRole ( 'heading' , { name : mockFolderNam e } ) ) . toBeInTheDocument ( ) ;
expect ( await screen . findByRole ( 'heading' , { name : folderTitl e } ) ) . toBeInTheDocument ( ) ;
expect ( screen . queryByRole ( 'button' , { name : 'Folder actions' } ) ) . not . toBeInTheDocument ( ) ;
} ) ;
@ -118,10 +82,24 @@ describe('browse-dashboards BrowseFolderAlertingPage', () => {
expect ( await screen . findByRole ( 'tab' , { name : 'Alert rules' } ) ) . toHaveAttribute ( 'aria-selected' , 'true' ) ;
} ) ;
it ( 'displays the alert rules returned by the API' , async ( ) = > {
it ( 'displays rules from the folder' , async ( ) = > {
const ruleUid = 'xYz1A2b3C4' ;
const group = alertingFactory . ruler . grafana . group . build ( {
name : 'test-group' ,
rules : [
alertingFactory . ruler . grafana . alertingRule . build ( {
grafana_alert : { title : 'Grafana-rule' , namespace_uid : folderUid , rule_group : 'test-group' , uid : ruleUid } ,
} ) ,
] ,
} ) ;
rulerTestDb . addGroup ( group , { name : folderTitle , uid : folderUid } ) ;
render ( < BrowseFolderAlertingPage / > ) ;
const ruleName = mockPrometheusRulesResponse . data . groups [ 0 ] . rules [ 0 ] . name ;
expect ( await screen . findByRole ( 'link' , { name : ruleName } ) ) . toBeInTheDocument ( ) ;
expect ( await screen . findByRole ( 'heading' , { name : folderTitle } ) ) . toBeInTheDocument ( ) ;
expect ( await screen . findByRole ( 'link' , { name : 'Grafana-rule' } ) ) . toHaveAttribute (
'href' ,
` /alerting/grafana/ ${ ruleUid } /view `
) ;
} ) ;
} ) ;