feat(color-contrast): add support for CSS mix-blend-mode

[Zidious]

mix-blend-mode functions:

• unit tests
• integration tests

This PR focuses on blending BG colours. An example of mix-blend-mode in action, consider the following:

<div id="A" style="background-color: rgba(255, 255, 255, 1.0);">
  <div id="B" style="background-color: rgba(0, 128, 0, 0.25);">
    <div id="C" style="background-color: rgba(255, 0, 0, 0.5); mix-blend-mode: difference;">
      <div id="D" style="background-color: rgba(0, 0, 255, 0.25);">Test Element</div>
    </div>
  </div>
</div>

When mix-blend-mode is applied onto a div it is considered an isolated group and therefore its own stacking context.

The stack of the above snippet would look like the following:

Root Group
  - #A
  - #B
  - isolated group
    - #C 
    - #D

When blending we do bottom up:

rootGroup = normal(B,normal(A, rootBackDrop))
isolatedGroup = normal(D, C)
difference(rootGroup, isolatedGroup) // outputs the final colour

For reference: compositing BG colours w3c assistance

Resources: Compositing and Blending - Note: further research I would like to investigate how to go about blending nested mix-blend-modes when in the same div block.

Closes issue: #3187

[dylanb]

two questions, see comments

[dylanb]

why did this change?

[Zidious]

The way were were actually blending the colours was not quite accurate. When you start adding alpha values to colours the way they are calculated is different. Opacity adds another step whereby the pre-multiplied computed new RGB values need to be divided by the new computed alpha, we were missing this step:

To extract the color component of a pre-multiplied value, the formula is reversed: Co = co / αo
source: https://www.w3.org/TR/compositing-1/#simplealphacompositing
helpful source: w3c/fxtf-drafts#440 (comment)

[dylanb]

why this change? Seems like a rounding difference of some sort.

[Zidious]

I believe this was caused by #3226 (comment) and the threshold of rounding was impacted