React-fontawesome: Title causes jest snapshots to fail

[jducro]

My jest snapshots don't work because the id of the title is randomly generated:

Received value does not match stored snapshot ">>> Alert --- Snapshot +++capturing Snapshot of Alert 1".

    - Snapshot
    + Received

    @@ -21,22 +21,23 @@
          className="dp-alert__content"
        >
          Success!
        </div>
        <svg
    -     aria-labelledby="svg-inline--fa-title-qxcLzMswzSD2"
    +     aria-labelledby="svg-inline--fa-title-uFW2RnKerKrK"
          className="svg-inline--fa fa-times fa-w-11 fa-xs dp-alert__close"
          data-icon="times"
          data-prefix="fas"
          onClick={[Function]}
          role="img"
          style={Object {}}
          viewBox="0 0 352 512"
          xmlns="http://www.w3.org/2000/svg"
        >
          <title
    -       id="svg-inline--fa-title-qxcLzMswzSD2"
    +       id="svg-inline--fa-title-uFW2RnKerKrK"
            style={Object {}}
          >
            Close
          </title>
          <path

Is there a way to make that work that is not removing the title?

Thanks

[jducro]

I actually manage to resolve that issue by mocking the Math.random() function at the beginning of the test files:

const mockMath = Object.create(global.Math);
mockMath.random = () => 0.5;
global.Math = mockMath;

[robmadole]

We'll be adding a way to explicitly set the id's that are generated in the future. That should address this.

[micksatana]

Is this problem solved? If so, it may re-occur. I'm facing the same issue, cannot snapshot test the FontAwesomeIcon

[joshuarize]

i was also able to fix with this:

beforeAll(() => {
    // fix bug with icon title
    const mockMath = Object.create(global.Math);
    mockMath.random = () => 0;
    global.Math = mockMath;
  });

delete the snapshots so that jest can re-create the snapshot.

[MariuszKogut]

You can also use this one liner:

jest.spyOn(global.Math, 'random').mockImplementation(() => 0)