search_query.spec.js in sequenceserver-3.1.0

- old
+ new

@@ -1,9 +1,8 @@
 /* eslint-disable no-unused-vars */
 /* eslint-disable no-undef */
 import { render, screen, fireEvent } from '@testing-library/react';
-import { SearchQueryWidget } from '../query';
 import { Form } from '../form';
 import { AMINO_ACID_SEQUENCE, NUCLEOTIDE_SEQUENCE, FASTQ_SEQUENCE, FASTA_OF_FASTQ_SEQUENCE } from './mock_data/sequences';
 import '@testing-library/jest-dom/extend-expect';
 import '@testing-library/react/dont-cleanup-after-each';
 
@@ -16,11 +15,11 @@
         } />).container;
         inputEl = screen.getByRole('textbox', { name: '' });
     });
 
     test('should render the search component textarea', () => {
-        expect(inputEl).toHaveClass('form-control');
+        expect(inputEl).toBeInTheDocument();
     });
 
     test('clear button should only become visible if textarea is not empty', () => {
         const getButtonWrapper = () => screen.getByRole('button', { name: /clear query sequence\(s\)\./i }).parentElement;
         expect(getButtonWrapper()).toHaveClass('hidden');
@@ -31,35 +30,35 @@
     });
 
     test('should correctly detect the amino-acid sequence type and show notification', () => {
         // populate search
         fireEvent.change(inputEl, { target: { value: AMINO_ACID_SEQUENCE } });
-        const activeNotification = container.querySelector('.notification.active');
+        const activeNotification = container.querySelector('[data-role=notification].active');
         expect(activeNotification.id).toBe('protein-sequence-notification');
         const alertWrapper = activeNotification.children[0];
         expect(alertWrapper).toHaveTextContent('Detected: amino-acid sequence(s).');
     });
 
     test('should correctly detect the nucleotide sequence type and show notification', () => {
         // populate search
         fireEvent.change(inputEl, { target: { value: NUCLEOTIDE_SEQUENCE } });
-        const activeNotification = container.querySelector('.notification.active');
+        const activeNotification = container.querySelector('[data-role=notification].active');
         const alertWrapper = activeNotification.children[0];
         expect(activeNotification.id).toBe('nucleotide-sequence-notification');
         expect(alertWrapper).toHaveTextContent('Detected: nucleotide sequence(s).');
     });
 
     test('should correctly detect the mixed sequences and show error notification', () => {
         fireEvent.change(inputEl, { target: { value: `${NUCLEOTIDE_SEQUENCE}${AMINO_ACID_SEQUENCE}` } });
-        const activeNotification = container.querySelector('.notification.active');
+        const activeNotification = container.querySelector('[data-role=notification].active');
         expect(activeNotification.id).toBe('mixed-sequence-notification');
         const alertWrapper = activeNotification.children[0];
         expect(alertWrapper).toHaveTextContent('Error: mixed nucleotide and amino-acid sequences detected.');
     });
 
     test('should correctly detect FASTQ and convert it to FASTA', () => {
         fireEvent.change(inputEl, { target: { value: FASTQ_SEQUENCE } });
-        const activeNotification = container.querySelector('.notification.active');
+        const activeNotification = container.querySelector('[data-role=notification].active');
         const alertWrapper = activeNotification.children[0];
         expect(activeNotification.id).toBe('fastq-sequence-notification');
         expect(alertWrapper).toHaveTextContent('Detected FASTQ and automatically converted to FASTA.');
         expect(inputEl).toHaveValue(FASTA_OF_FASTQ_SEQUENCE);
     });