Skip to content

Commit

Permalink
Merge pull request #511 from ral-facilities/DSEGOG-351-integrate-favo…
Browse files Browse the repository at this point in the history 
…urite-filters-with-filters

DSEGOG-351 integrate favourite filters with filters
  • Loading branch information
@joshuadkitenge
joshuadkitenge authored Dec 9, 2024
2 parents 975abe0 + dcecb5a commit 6dc5f3d
Show file tree
Hide file tree
Showing 11 changed files with 830 additions and 157 deletions.
126 changes: 120 additions & 6 deletions cypress/e2e/filtering.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -435,6 +435,45 @@ describe('Filtering Component', () => {
cy.get('input[role="combobox"]').should('have.value', 'INVALID');
});

it('add a new favourite filter', () => {
cy.contains('Filter').click();

cy.findByRole('combobox', { name: 'Filter' }).type(
'sh{enter}={enter}1{enter}'
);

cy.findByRole('button', { name: 'Add as favourite filter' })
.first()
.click();

cy.findAllByLabelText('Name').last().type('test');

cy.findByRole('button', { name: 'Save' }).should('not.be.disabled');

cy.startSnoopingBrowserMockedRequest();
cy.findByRole('button', { name: 'Save' }).click();

cy.findBrowserMockedRequests({
method: 'POST',
url: '/users/filters',
}).should((patchRequests) => {
expect(patchRequests.length).equal(1);
const request = patchRequests[0];

expect(request.url.toString()).to.contain('name=');
expect(request.url.toString()).to.contain('filter=');

const paramMap: Map<string, string> = getParamsFromUrl(
request.url.toString()
);

expect(paramMap.get('name')).equal('test');
expect(paramMap.get('filter')).equal(
'[{"type":"channel","value":"shotnum","label":"Shot+Number"},{"type":"compop","value":"=","label":"="},{"type":"number","value":"1","label":"1"}]'
);
});
});

it('lets a user create multiple filters and delete them', () => {
cy.contains('Filter').click();

Expand Down Expand Up @@ -539,6 +578,61 @@ describe('Filtering Component', () => {
});
});

it('displays and clears duplicate name error (add)', () => {
cy.findByRole('button', { name: 'Add new favourite filter' }).click();
cy.findAllByLabelText('Name').last().type('test 1');
cy.findByRole('combobox', { name: 'Filter' }).type(
'sh{enter}={enter}1{enter}'
);

cy.findByRole('button', { name: 'Save' }).should('not.be.disabled');

cy.findByRole('button', { name: 'Save' }).click();

cy.findByRole('button', { name: 'Save' }).should('be.disabled');

cy.findByText(
'A filter with this name already exists. Please choose a different name.'
).should('exist');

cy.findAllByLabelText('Name').last().type('2');

cy.findByText(
'A filter with this name already exists. Please choose a different name.'
).should('not.exist');
});

it('add a new favourite filter using favourite filter option in menu', () => {
cy.findByRole('checkbox', {
name: 'Select test 2 favourite filter',
}).click();

cy.findByRole('dialog').within(() => {
cy.findByText('Filters').click();
});
cy.findByRole('combobox', { name: 'Filter' }).type('test 2{enter}');

cy.findByRole('button', { name: 'Apply' }).should('not.be.disabled');

cy.startSnoopingBrowserMockedRequest();
cy.findByRole('button', { name: 'Apply' }).click();

cy.findByRole('table').should('be.visible');

cy.findBrowserMockedRequests({ method: 'GET', url: '/records' }).should(
(patchRequests) => {
expect(patchRequests.length).equal(1);
const request = patchRequests[0];

expect(request.url.toString()).to.contain('conditions=');
expect(request.url.toString()).to.contain(
`conditions=${encodeURIComponent(
'{"$and":[{"metadata.shotnum":{"$eq":1}}]}'
)}`
);
}
);
});
it('display favourite filters', () => {
cy.findByDisplayValue('test 1').should('exist');
cy.findByDisplayValue('test 2').should('exist');
Expand Down Expand Up @@ -605,6 +699,30 @@ describe('Filtering Component', () => {
});
});

it('displays and clears duplicate name error (edit)', () => {
cy.findByRole('button', {
name: 'Edit test 1 favourite filter',
}).click();
cy.findAllByLabelText('Name').last().clear();
cy.findAllByLabelText('Name').last().type('test 2');

cy.findByRole('button', { name: 'Save' }).should('not.be.disabled');

cy.findByRole('button', { name: 'Save' }).click();

cy.findByRole('button', { name: 'Save' }).should('be.disabled');

cy.findByText(
'A filter with this name already exists. Please choose a different name.'
).should('exist');

cy.findAllByLabelText('Name').last().type('2');

cy.findByText(
'A filter with this name already exists. Please choose a different name.'
).should('not.exist');
});

it('display error when values have not be changed and bee clear if name is changed', () => {
cy.findByRole('button', {
name: 'Edit test 1 favourite filter',
Expand All @@ -626,9 +744,7 @@ describe('Filtering Component', () => {
cy.findByRole('button', {
name: 'Edit test 1 favourite filter',
}).click();
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}'); // Equivalent to {arrowright}
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}');
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}');

cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
Expand Down Expand Up @@ -672,9 +788,7 @@ describe('Filtering Component', () => {
"There have been no changes made. Please change a field's value or press Close to exit."
).should('exist');
cy.findByRole('button', { name: 'Save' }).should('be.disabled');
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}'); // Equivalent to {arrowright}
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}');
cy.findByRole('combobox', { name: 'Filter' }).type('{rightarrow}');

cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
cy.findByRole('combobox', { name: 'Filter' }).type('{backspace}');
Expand Down
3 changes: 0 additions & 3 deletions e2e/real/filtering.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -135,9 +135,6 @@ test('CRUD favourite filter', async ({ page }) => {

// Edit the filter by replacing 42 with 40
await firstFilterInput.click(); // Focus on the filter input
await firstFilterInput.press('ArrowRight'); // Navigate to the end of the input
await firstFilterInput.press('ArrowRight'); // Navigate to the end of the input
await firstFilterInput.press('ArrowRight'); // Navigate to the end of the input
await firstFilterInput.press('Backspace'); // Remove '42'
await firstFilterInput.pressSequentially('40'); // Type '4'
await firstFilterInput.press('Enter'); // Confirm the new filter value
Expand Down
40 changes: 20 additions & 20 deletions src/filtering/__snapshots__/favouriteFilterDialogue.component.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -403,13 +403,13 @@ exports[`Favorite filter dialogue component > Edit dialog > renders correctly 1`
tabindex="-1"
>
<div
aria-labelledby=":ro:"
aria-labelledby=":r10:"
class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation24 MuiDialog-paper MuiDialog-paperScrollPaper MuiDialog-paperWidthLg MuiDialog-paperFullWidth css-cyxlny-MuiPaper-root-MuiDialog-paper"
role="dialog"
>
<h2
class="MuiTypography-root MuiTypography-h6 MuiDialogTitle-root css-bdhsul-MuiTypography-root-MuiDialogTitle-root"
id=":ro:"
id=":r10:"
>
Edit
Favourite filter
Expand All @@ -432,8 +432,8 @@ exports[`Favorite filter dialogue component > Edit dialog > renders correctly 1`
<label
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeSmall MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
data-shrink="true"
for=":rp:"
id=":rp:-label"
for=":r11:"
id=":r11:-label"
>
Name
</label>
Expand All @@ -443,7 +443,7 @@ exports[`Favorite filter dialogue component > Edit dialog > renders correctly 1`
<input
aria-invalid="false"
class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall css-1n4twyu-MuiInputBase-input-MuiOutlinedInput-input"
id=":rp:"
id=":r11:"
type="text"
value="test 1"
/>
Expand Down Expand Up @@ -474,28 +474,15 @@ exports[`Favorite filter dialogue component > Edit dialog > renders correctly 1`
<label
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-sizeSmall MuiInputLabel-outlined css-1jy569b-MuiFormLabel-root-MuiInputLabel-root"
data-shrink="true"
for=":rq:"
id=":rq:-label"
for=":r12:"
id=":r12:-label"
>
Filter
</label>
<div
class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-sizeSmall MuiInputBase-adornedStart MuiInputBase-adornedEnd MuiAutocomplete-inputRoot css-1gywuxd-MuiInputBase-root-MuiOutlinedInput-root"
data-id="Input"
>
<input
aria-autocomplete="list"
aria-expanded="false"
aria-invalid="false"
autocapitalize="none"
autocomplete="off"
class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall MuiInputBase-inputAdornedStart MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-12yjm75-MuiInputBase-input-MuiOutlinedInput-input"
id=":rq:"
role="combobox"
spellcheck="false"
type="text"
value=""
/>
<div
class="MuiButtonBase-root MuiChip-root MuiChip-filled MuiChip-sizeSmall MuiChip-colorDefault MuiChip-deletable MuiChip-deletableColorDefault MuiChip-filledDefault MuiAutocomplete-tag MuiAutocomplete-tagSizeSmall css-1a9jshs-MuiButtonBase-root-MuiChip-root"
data-tag-index="0"
Expand Down Expand Up @@ -565,6 +552,19 @@ exports[`Favorite filter dialogue component > Edit dialog > renders correctly 1`
/>
</svg>
</div>
<input
aria-autocomplete="list"
aria-expanded="false"
aria-invalid="false"
autocapitalize="none"
autocomplete="off"
class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall MuiInputBase-inputAdornedStart MuiInputBase-inputAdornedEnd MuiAutocomplete-input MuiAutocomplete-inputFocused css-12yjm75-MuiInputBase-input-MuiOutlinedInput-input"
id=":r12:"
role="combobox"
spellcheck="false"
type="text"
value=""
/>
<fieldset
aria-hidden="true"
class="MuiOutlinedInput-notchedOutline css-1d3z3hw-MuiOutlinedInput-notchedOutline"
Expand Down
Loading

0 comments on commit 6dc5f3d

Please sign in to comment.