Chore: Convert GraphTicks test to RTL (#51203)

* Convert GraphTicks test to RTL

* Convert GraphTicks test to RTL

.betterer.results

@@ -29,9 +29,6 @@ exports[`no enzyme tests`] = {
     "packages/grafana-ui/src/slate-plugins/suggestions.test.tsx:3654981205": [
       [0, 18, 13, "RegExp match", "2409514259"]
     ],
-    "packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/GraphTicks.test.js:940336852": [
-      [14, 19, 13, "RegExp match", "2409514259"]
-    ],
     "packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/Scrubber.test.js:4256741694": [
       [14, 19, 13, "RegExp match", "2409514259"]
     ],

packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/GraphTicks.test.js

@@ -12,12 +12,12 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { shallow } from 'enzyme';
+import { render, screen, within } from '@testing-library/react';
 import React from 'react';
 
 import GraphTicks from './GraphTicks';
 
-describe('<GraphTicks>', () => {
+const setup = (propOverrides) => {
   const defaultProps = {
     items: [
       { valueWidth: 100, valueOffset: 25, serviceName: 'a' },
@@ -25,20 +25,27 @@ describe('<GraphTicks>', () => {
     ],
     valueWidth: 200,
     numTicks: 4,
+    ...propOverrides,
   };
 
-  let ticksG;
-
-  beforeEach(() => {
-    const wrapper = shallow(<GraphTicks {...defaultProps} />);
-    ticksG = wrapper.find('[data-test="ticks"]');
-  });
+  return render(
+    <svg>
+      <GraphTicks {...defaultProps} />
+    </svg>
+  );
+};
 
+describe('GraphTicks tests', () => {
   it('creates a <g> for ticks', () => {
-    expect(ticksG.length).toBe(1);
+    setup();
+
+    expect(screen.getByTestId('ticks')).toBeInTheDocument();
   });
 
   it('creates a line for each ticks excluding the first and last', () => {
-    expect(ticksG.find('line').length).toBe(defaultProps.numTicks - 1);
+    setup({ numTicks: 6 });
+
+    // defaultProps.numTicks - 1 === expect
+    expect(screen.getByTestId('ticks').children).toHaveLength(5);
   });
 });

packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/GraphTicks.tsx

@@ -42,7 +42,7 @@ export default function GraphTicks(props: GraphTicksProps) {
   }
 
   return (
-    <g data-test="ticks" aria-hidden="true">
+    <g data-testid="ticks" aria-hidden="true">
       {ticks}
     </g>
   );