Use proper ref instead of svgRef in tests

packages/react-scripts/config/jest/fileTransform.js

@@ -1,11 +1,3 @@
-// @remove-on-eject-begin
-/**
- * Copyright (c) 2014-present, Facebook, Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-// @remove-on-eject-end
 'use strict';
 
 const path = require('path');
@@ -18,18 +10,19 @@ module.exports = {
     const assetFilename = JSON.stringify(path.basename(filename));
 
     if (filename.match(/\.svg$/)) {
-      return `module.exports = {
+      return `const React = require('react');
+      module.exports = {
         __esModule: true,
         default: ${assetFilename},
-        ReactComponent: ({ svgRef, ...props }) => ({
+        ReactComponent: React.forwardRef((props, ref) => ({
           $$typeof: Symbol.for('react.element'),
           type: 'svg',
-          ref: svgRef || null,
+          ref: ref,
           key: null,
           props: Object.assign({}, props, {
             children: ${assetFilename}
           })
-        }),
+        })),
       };`;
     }
 

packages/react-scripts/fixtures/kitchensink/src/features/webpack/SvgComponent.js

@@ -12,6 +12,6 @@ export default () => {
   return <Logo id="feature-svg-component" />;
 };
 
-export const SvgComponentWithRef = ({ svgRef }) => (
-  <Logo id="feature-svg-component-with-ref" svgRef={svgRef} />
-);
+export const SvgComponentWithRef = React.forwardRef((props, ref) => (
+  <Logo id="feature-svg-component-with-ref" ref={ref} />
+));

packages/react-scripts/fixtures/kitchensink/src/features/webpack/SvgComponent.test.js

@@ -16,10 +16,10 @@ describe('svg component', () => {
     expect(div.textContent).toBe('logo.svg');
   });
 
-  it('svg root element ref is passed svgRef', () => {
+  it('svg root element equals the passed ref', () => {
     const div = document.createElement('div');
     const someRef = React.createRef();
-    ReactDOM.render(<SvgComponentWithRef svgRef={someRef} />, div);
+    ReactDOM.render(<SvgComponentWithRef ref={someRef} />, div);
     const svgElement = div.getElementsByTagName('svg');
     expect(svgElement).toHaveLength(1);
     expect(svgElement[0]).toBe(someRef.current);