diff --git a/x-pack/plugins/apm/public/components/app/alerts_overview/alerts_overview_table.test.tsx b/x-pack/plugins/apm/public/components/app/alerts_overview/alerts_overview_table.test.tsx
new file mode 100644
index 0000000000000..711b7ff389fe3
--- /dev/null
+++ b/x-pack/plugins/apm/public/components/app/alerts_overview/alerts_overview_table.test.tsx
@@ -0,0 +1,166 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { render, waitFor, act } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
+import React, { ReactNode } from 'react';
+import { MockApmPluginContextWrapper } from '../../../context/apm_plugin/mock_apm_plugin_context';
+import * as useApmParamsHooks from '../../../hooks/use_apm_params';
+import { createKibanaReactContext } from '@kbn/kibana-react-plugin/public';
+import { CoreStart } from '@kbn/core/public';
+import { AlertsOverview } from '.';
+
+const getAlertsStateTableMock = jest.fn();
+
+function Wrapper({ children }: { children?: ReactNode }) {
+ const KibanaReactContext = createKibanaReactContext({
+ triggersActionsUi: {
+ getAlertsStateTable: getAlertsStateTableMock.mockReturnValue(
+
+ ),
+ alertsTableConfigurationRegistry: '',
+ },
+ } as Partial);
+
+ return (
+
+
+ {children}
+
+
+ );
+}
+
+const renderOptions = { wrapper: Wrapper };
+
+describe('AlertsTable', () => {
+ beforeEach(() => {
+ jest.spyOn(useApmParamsHooks as any, 'useApmParams').mockReturnValue({
+ path: {
+ serviceName: 'opbeans',
+ },
+ query: {
+ rangeFrom: 'now-24h',
+ rangeTo: 'now',
+ environment: 'testing',
+ },
+ });
+ jest.clearAllMocks();
+ });
+
+ it('renders alerts table', async () => {
+ const { getByTestId } = render(, renderOptions);
+
+ await waitFor(async () => {
+ expect(getByTestId('alerts-table')).toBeTruthy();
+ });
+ });
+ it('should call alerts table with correct propts', async () => {
+ act(() => {
+ render(, renderOptions);
+ });
+
+ await waitFor(async () => {
+ expect(getAlertsStateTableMock).toHaveBeenCalledWith(
+ {
+ alertsTableConfigurationRegistry: '',
+ id: 'service-overview-alerts',
+ configurationId: 'observability',
+ featureIds: ['apm'],
+ query: {
+ bool: {
+ filter: [
+ {
+ term: { 'service.name': 'opbeans' },
+ },
+ {
+ term: { 'service.environment': 'testing' },
+ },
+ ],
+ },
+ },
+ showExpandToDetails: false,
+ },
+ {}
+ );
+ });
+ });
+
+ it('should call alerts table with active filter', async () => {
+ const { getByTestId } = render(, renderOptions);
+
+ await act(async () => {
+ const inputEl = getByTestId('active');
+ inputEl.click();
+ });
+
+ await waitFor(async () => {
+ expect(getAlertsStateTableMock).toHaveBeenLastCalledWith(
+ {
+ alertsTableConfigurationRegistry: '',
+ id: 'service-overview-alerts',
+ configurationId: 'observability',
+ featureIds: ['apm'],
+ query: {
+ bool: {
+ filter: [
+ {
+ term: { 'service.name': 'opbeans' },
+ },
+ {
+ term: { 'kibana.alert.status': 'active' },
+ },
+ {
+ term: { 'service.environment': 'testing' },
+ },
+ ],
+ },
+ },
+ showExpandToDetails: false,
+ },
+ {}
+ );
+ });
+ });
+
+ it('should call alerts table with recovered filter', async () => {
+ const { getByTestId } = render(, renderOptions);
+
+ await act(async () => {
+ const inputEl = getByTestId('recovered');
+ inputEl.click();
+ });
+
+ await waitFor(async () => {
+ expect(getAlertsStateTableMock).toHaveBeenLastCalledWith(
+ {
+ alertsTableConfigurationRegistry: '',
+ id: 'service-overview-alerts',
+ configurationId: 'observability',
+ featureIds: ['apm'],
+ query: {
+ bool: {
+ filter: [
+ {
+ term: { 'service.name': 'opbeans' },
+ },
+ {
+ term: { 'kibana.alert.status': 'recovered' },
+ },
+ {
+ term: { 'service.environment': 'testing' },
+ },
+ ],
+ },
+ },
+ showExpandToDetails: false,
+ },
+ {}
+ );
+ });
+ });
+});