gitlab-org--gitlab-foss/spec/frontend/alert_handler_spec.js

46 lines
1.4 KiB
JavaScript

import { setHTMLFixture } from 'helpers/fixtures';
import initAlertHandler from '~/alert_handler';
describe('Alert Handler', () => {
const ALERT_SELECTOR = 'gl-alert';
const CLOSE_SELECTOR = 'gl-alert-dismiss';
const ALERT_HTML = `<div class="${ALERT_SELECTOR}"><button class="${CLOSE_SELECTOR}">Dismiss</button></div>`;
const findFirstAlert = () => document.querySelector(`.${ALERT_SELECTOR}`);
const findAllAlerts = () => document.querySelectorAll(`.${ALERT_SELECTOR}`);
const findFirstCloseButton = () => document.querySelector(`.${CLOSE_SELECTOR}`);
describe('initAlertHandler', () => {
describe('with one alert', () => {
beforeEach(() => {
setHTMLFixture(ALERT_HTML);
initAlertHandler();
});
it('should render the alert', () => {
expect(findFirstAlert()).toExist();
});
it('should dismiss the alert on click', () => {
findFirstCloseButton().click();
expect(findFirstAlert()).not.toExist();
});
});
describe('with two alerts', () => {
beforeEach(() => {
setHTMLFixture(ALERT_HTML + ALERT_HTML);
initAlertHandler();
});
it('should render two alerts', () => {
expect(findAllAlerts()).toHaveLength(2);
});
it('should dismiss only one alert on click', () => {
findFirstCloseButton().click();
expect(findAllAlerts()).toHaveLength(1);
});
});
});
});