Fix mediaRegex to allow dot special character

[santino]

Introduction

The mediaRegex is responsible for normalising media queries to be matched against CSS rules.

When defining a CSS rule like @media (min-width: 576px) { ... } this gets transformed to @media screen and (min-width:576px) (note the missing space after the colon); these rules can be tested with toHaveStyleRule by adding the following key-value to the options object { media: '(min-width: 576px)' } and the mediaRegex will transform this at-rule into (min-width:576px) so that it can match the rule attached to the component.

The issue

This doesn't work with decimal values as the regex takes into consideration only letters after the colon.
Decimal values are fully valid and commonly used (even by bootstrap) to avoid things like breakpoints overlap on high-dpi devices and custom zoom.

It might be easy to think that this could be worked around with just removing the space when writing the test condition like so { media: '(min-width:575.98px)' } but first of all the reason for the failure is not obvious at all and secondly this wouldn't work with defined breakpoints where you want your tests to use declared variables rather than manually writing your breakpoints on every test which would force to change all tests whenever these needs to be updated; the following should be achievable:

{ media: `(${theme.devices.small.down})` }

The fix

This PR adds support to decimal values in media queries for toHaveStyleRule.
An additional unit test has been added to make sure this is taken into consideration for any future update.

Release

As usual I will be very grateful if this could be released ASAP so that I could get my tests to pass again, especially considering that this would be just a patch making it a straightforward release :)

[MicheleBertoli]

[MicheleBertoli]

Thank you very much, @santino, and please install v6.2.0 which incorporates this change.