Skip to content

chore(components): upgrade LeafyGreen non-modal (+ some chat related) components COMPASS-9642 #7582

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
kraenhansen merged 33 commits into from
Nov 25, 2025
Merged

chore(components): upgrade LeafyGreen non-modal (+ some chat related) components COMPASS-9642 #7582

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
33 commits
Select commit Hold shift + click to select a range
6b50730
Remove patch-leafygreen-button
kraenhansen Sep 30, 2025
43dc230
Delete unused packages
kraenhansen Nov 21, 2025
f042cd0
Bump LG packages
kraenhansen Nov 17, 2025
581e012
Fix type error in e2e-tests
kraenhansen Oct 7, 2025
bb1f668
Fix incorrect React.Ref type argument in generative-ai
kraenhansen Sep 30, 2025
4116bf2
Add autoFocus prop to compass-editor
kraenhansen Oct 1, 2025
4c35c6a
Use named over default exports
kraenhansen Nov 17, 2025
0bde132
Fix Button / IconButton links
kraenhansen Sep 30, 2025
2c213a2
Fix ActionButton prop types
kraenhansen Sep 30, 2025
c4b510b
Remove defaultValue workaround
kraenhansen Nov 17, 2025
1643455
Fix SmallIconButton props
kraenhansen Sep 30, 2025
bfcd92c
TEMP: Working around https://jira.mongodb.org/browse/LG-5461
kraenhansen Sep 30, 2025
f8ab37d
Workaround for React.ComponentProps<typeof Button> no longer working
kraenhansen Sep 30, 2025
c33b90e
TEMP work around https://jira.mongodb.org/browse/LG-5590
kraenhansen Oct 1, 2025
f622a80
Fix issue passing Popover ref into IconButton
kraenhansen Oct 1, 2025
bd565a3
Fix check failure in guide-cue spec
kraenhansen Oct 7, 2025
66bc1e6
Removed extraneous ts-expect-error
kraenhansen Nov 5, 2025
6e99b2c
Update to account for breaking change in select v16.2.0
kraenhansen Nov 5, 2025
0be5d0a
Wait for crud elements to become visible before interacting
kraenhansen Nov 6, 2025
623bf10
Update existing tests to handle changes in Select
kraenhansen Nov 6, 2025
4142956
Fix index creation interactions with ComboBox
kraenhansen Nov 7, 2025
d4d2769
Update e2e tests to use setComboBoxValue instead of setValueVisible w…
kraenhansen Nov 7, 2025
2090deb
Update e2e tests to expect chat messages to not be displayed when dec…
kraenhansen Nov 7, 2025
d5ae3a0
Update ConnectDropdownButton to reflect change in SplitButton
kraenhansen Nov 10, 2025
b01bf22
Update e2e test to use a different selector for menu items in "CSV fi…
kraenhansen Nov 10, 2025
f3c65e4
Skip opening the assistant drawer if it's already open
kraenhansen Nov 11, 2025
c37c211
Assistant tests: Add option to useExplainPlanEntryPoint to avoid wait…
kraenhansen Nov 12, 2025
fac7e14
Assistant tests: Close drawer after every test.
kraenhansen Nov 17, 2025
d7329d0
Export ConfirmationModalProps fixing re-export of showConfirmation in…
kraenhansen Nov 17, 2025
12f7ae9
Update modal close selector
kraenhansen Nov 19, 2025
d276850
Update use of chat-provider v6
kraenhansen Nov 21, 2025
b2861ce
Update package lock
kraenhansen Nov 24, 2025
694ac4e
Update assistant tests to reflect change in LG
kraenhansen Nov 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Wait for crud elements to become visible before interacting
  • Loading branch information
@kraenhansen
kraenhansen committed Nov 25, 2025
commit 0be5d0a3487ce6d074c6bce46b8c37eadedb505b
13 changes: 7 additions & 6 deletions packages/compass-crud/src/components/bulk-update-modal.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -218,15 +218,16 @@ describe('BulkUpdateModal Component', function () {
expect(onUpdateSpy).to.have.been.calledOnce;
});

it('saves the query when a name is provided', function () {
it('saves the query when a name is provided', async function () {
const saveUpdateQuerySpy = sinon.spy();
renderBulkUpdateModal({ saveUpdateQuery: saveUpdateQuerySpy });
renderBulkUpdateModal({
saveUpdateQuery: saveUpdateQuerySpy,
});

userEvent.click(screen.getByTestId('inline-save-query-modal-opener'));
userEvent.type(
screen.getByTestId('inline-save-query-modal-input'),
'MySavedQuery'
);
const inputElement = screen.getByTestId('inline-save-query-modal-input');
await waitFor(() => expect(inputElement).to.be.visible);
userEvent.type(inputElement, 'MySavedQuery');

userEvent.click(screen.getByTestId('inline-save-query-modal-submit'));
expect(saveUpdateQuerySpy).to.have.been.calledOnceWith('MySavedQuery');
Expand Down
19 changes: 12 additions & 7 deletions packages/compass-crud/src/components/crud-toolbar.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ const noop = () => {

const testOutdatedMessageId = 'crud-outdated-message-id';
const testErrorMessageId = 'document-list-error-summary';
const testDocumentsPerPageId = 'crud-document-per-page-selector';

const addDataText = 'Add Data';
const updateDataText = 'Update';
Expand Down Expand Up @@ -482,20 +483,24 @@ describe('CrudToolbar Component', function () {
});

describe('documents per page select', function () {
it('should render a select to update documents fetched per page', function () {
it('should render a select to update documents fetched per page', async function () {
renderCrudToolbar();
expect(screen.getByLabelText('Update number of documents per page')).to.be
.visible;

await waitFor(
() => expect(screen.getByTestId(testDocumentsPerPageId)).to.be.visible
);
});

it('should call updateDocumentsPerPage when select value changes', function () {
it('should call updateDocumentsPerPage when select value changes', async function () {
const stub = sinon.stub();
renderCrudToolbar({
updateMaxDocumentsPerPage: stub,
});
userEvent.click(
screen.getByLabelText('Update number of documents per page')
);

const selector = screen.getByTestId(testDocumentsPerPageId);

await waitFor(() => expect(selector).to.be.visible);
Comment on lines +500 to +502
Copy link
Collaborator

@gribnoysup gribnoysup Nov 25, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a weird change, getBy* methods will throw if element is not found, so either waitFor is redundant here (there's just no reason to waitFor if we got to running this code), or the rendering might be delayed by something and you want the getBy logic to be inside the waitFor (that's what we usually use it for)

Suggested change
const selector = screen.getByTestId(testDocumentsPerPageId);
await waitFor(() => expect(selector).to.be.visible);
const selector = await waitFor(() => screen.getByTestId(testDocumentsPerPageId));

Copy link
Contributor Author

@kraenhansen kraenhansen Nov 25, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It can be in the DOM without being visible, no? In which case this will re-run until it exists and is visible?

Copy link
Collaborator

@gribnoysup gribnoysup Nov 25, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, my bad, so accustomed to seeing .to.exist in the tests, didn't notice it's the visible check 🙂

userEvent.click(selector);
userEvent.click(screen.getByText('75'));
expect(stub).to.be.calledWithExactly(75);
});
Expand Down
1 change: 1 addition & 0 deletions packages/compass-crud/src/components/crud-toolbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -401,6 +401,7 @@ const CrudToolbar: React.FunctionComponent<CrudToolbarProps> = ({
</div>
<div className={toolbarRightActionStyles}>
<Select
data-testid="crud-document-per-page-selector"
size="xsmall"
disabled={isFetching}
allowDeselect={false}
Expand Down