-
Notifications
You must be signed in to change notification settings - Fork 503
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.
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
Migrate TraceTimelineLink.test.js
from enzyme to RTL
#1960
Conversation
Signed-off-by: Eshaan Aggarwal <[email protected]>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks!
}); | ||
|
||
it('links to the given trace', () => { | ||
expect(wrapper.find('a').prop('href')).toBe(`/trace/${traceID}`); | ||
expect(screen.getByRole('link').href).toBe(`http://localhost/trace/${traceID}`); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
interesting, why is this changing from no-host URL to http://localhost
? That seems counterintuitive - localhost is very dependent on where the code runs
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is because AFAIK while rendering RTL actually converts all the the relative links to the actual complete URLs to which the same anchor is supposed to route to. I get the feeling of it being a bit counterintuitive, but since the tests would always be running in either locally or in workflows (and never in build or production), the same shouldn't be ambiguous or flaky.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I didn't see any other tests asserting full URL with host name (unless the test provided the value like example.com), so I added URL parsing bit
Signed-off-by: Yuri Shkuro <[email protected]>
TraceTimelineLink.test.js
from enzyme to RTLTraceTimelineLink.test.js
from enzyme to RTL
}); | ||
|
||
it('links to the given trace', () => { | ||
expect(wrapper.find('a').prop('href')).toBe(`/trace/${traceID}`); | ||
expect(screen.getByRole('link').href).toBe(`http://localhost/trace/${traceID}`); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
expect(screen.getByRole('link').href).toBe(`http://localhost/trace/${traceID}`); | |
expect(screen.getByRole('link')).toHaveAttribute('href', `/trace/${traceID}`); |
I think checking for the jsx dom attribute would make more sense in this case rather than the rendered dom attribute.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
expect(...).toHaveAttribute is not a function
but changing to toHaveProperty
still results in full URL:
expect(received).toHaveProperty(path, value)
Expected path: "href"
Expected value: "/trace/test-trace-id"
Received value: "http://localhost/trace/test-trace-id"
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, you need to import import '@testing-library/jest-dom';
for it to work
@@ -13,30 +13,31 @@ | |||
// limitations under the License. | |||
|
|||
import * as React from 'react'; | |||
import { shallow } from 'enzyme'; | |||
import { render, screen, fireEvent, createEvent } from '@testing-library/react'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
import { render, screen, fireEvent, createEvent } from '@testing-library/react'; | |
import { render, screen, fireEvent, createEvent } from '@testing-library/react'; | |
import '@testing-library/jest-dom'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why do we import the jest-dom
environment here?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Functions like toHaveAttribute
can be used with that import, but since Yuri has added a new URL parsing logic, this change is not required.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ah, with this ^ the other suggestion works. But I prefer a more explicit / brute-force new URL().pathname
.
Codecov ReportAll modified and coverable lines are covered by tests ✅
📢 Thoughts on this report? Let us know! |
@EshaanAgg thank you! 🎈🎈🎈 |
Which problem is this PR solving?
Fixes part of #1668
Description of the changes
Migrated the
TraceTimelineLink.test.js
toRTL
using the idiomatic RTL practicesHow was this change tested?
Ran the test suite to ensure all changes passed.
Checklist
jaeger
:make lint test
jaeger-ui
:yarn lint
andyarn test