Synchronous env detection via `<WithEnvironment />`

[molefrog]

Resolves #59

This PR implements <WithEnvironment /> component which can be used to detect the current env. It has an improved check for Preact that relies on the number of arguments passed down to render() and it doesn't require a re-render. I haven't wired it up with the rest of the code yet (I plan to do that in the next PR), as there are some caveats we need to discuss first:

1. It uses a class keyword which could potentially increase the bundle size since we target es5 in the config. I don't think it would create any issues though, but proper bundle analysis is probably required
2. There is no proper test to check if the argument condition does indeed return true when rendered via Preact. I guess that's the responsibility of a more higher-level integration test, ideally covered by <FpjsProvider /> tests, but I didn't want to overload the PR and wanted to make it more atomic.

[TheUnderScorer]

Thanks for the PR @molefrog! I don't have any comments so far, everything looks good.

Let's keep this PR as a "feature branch" so that you can target your next PRs to this one, and once everything is ready we can merge it into a single release.

[molefrog]

Let's keep this PR as a "feature branch" so that you can target your next PRs to this one, and once everything is ready we can merge it into a single release.

Good, I was actually going to propose the same thing. I'll try to get the next one ready early next week.

[molefrog]

Hi @TheUnderScorer, I've just updated the branch with the changes we discussed:

• FpjsProvider now uses WithEnvironment internally. This allowed me to simplify the initialisation logic and now the client is only initialised on a) the first render b) when the config changes if forceRebuild is set to true
• I covered the new Preact detection logic with a simple test. Unfortunately, having two test suites in one file for React and Preact wasn't possible, there are some logic involved with the way modules are required. So I had to introduce a file with-environment.preact.test.tsx not sure if it matches the naming conventions so I'm open to feedback.

[TheUnderScorer]

Thanks for the update @molefrog!

I like the preact test suite implementation, nice work!

[molefrog]

@molefrog I've fixed all of the comments above, including the removal of SyntheticEventDetector which is not being used anymore in the code.

[TheUnderScorer]

Thanks, @molefrog! From your perspective, do you think that there is anything left to do in regard of this PR?

[molefrog]

Thanks, @molefrog! From your perspective, do you think that there is anything left to do in regard of this PR?

Well, I have tested all examples in the repo with a real API key, works as expected.

There is one additional commit I haven't added here, which is supposed to add an extra check before we call cloneElement in WithEnvironment. Calling cloneElement on plain children (text, booleans etc.) breaks the render, however our types don't allow such children.

https://github.com/molefrog/fingerprintjs-pro-react/commit/215d674ad462e6696a8605501d3cd4c638fc50d8

I think we can safely ignore this, but it is up to you.

[molefrog]

Hi! Just curious if there is anything else that I should consider working on in this PR 😃 I have some ideas for further improvements, but I just don't want overload this PR.

[TheUnderScorer]

Hel @molefrog!

For now, I think that we can consider it finished 😃. Sorry for the overall delay, I was on holiday for the last couple of days.

[ilfa]

:tada: This PR is included in version 1.4.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: