added tests and updated getContrast function for APCA support

packages/contrast-colors/test/contrast.test.mjs

@@ -41,3 +41,44 @@ test('should provide contrast when passing base value (5.64...)', () => {
 
   expect(contrastValue).toBe(5.635834988986869);
 });
+
+
+/** 
+ * Test APCA colors
+ */
+
+test('should provide APCA contrast of ~ 75.6', () => {
+  const contrastValue = contrast([18, 52, 176], [233, 228, 208], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(75.57062523197818);
+});
+
+test('should provide APCA contrast of ~ -78.3', () => {
+  const contrastValue = contrast([233, 228, 208], [18, 52, 176], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(-78.28508284557655);
+});
+
+test('should provide APCA contrast of ~ 38.7', () => {
+  const contrastValue = contrast([255, 162, 0], [255,255,255], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(38.67214116963013);
+});
+
+test('should provide APCA contrast of ~ -43.1', () => {
+  const contrastValue = contrast([255,255,255], [255, 162, 0], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(-43.12544505836451);
+});
+
+test('should provide APCA contrast of ~ -107.9', () => {
+  const contrastValue = contrast([255,255,255], [0, 0, 0], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(-107.88473318309848);
+});
+
+test('should provide APCA contrast of ~ 106', () => {
+  const contrastValue = contrast([0, 0, 0], [255,255,255], undefined, 'wcag3'); // lighter gray is UI color, gray is base. Should return negative whole number
+
+  expect(contrastValue).toBe(106.04067321268862);
+});

packages/contrast-colors/utils.mjs

@@ -10,6 +10,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
+import { APCAcontrast, sRGBtoY } from "apca-w3";
 import chroma from "chroma-js";
 import { catmullRom2bezier, prepareCurve } from "./curve";
 
@@ -383,36 +384,42 @@ function luminance(r, g, b) {
   return (a[0] * 0.2126) + (a[1] * 0.7152) + (a[2] * 0.0722);
 }
 
-function getContrast(color, base, baseV) {
-  if (baseV === undefined) { // If base is an array and baseV undefined
-    const baseLightness = chroma.rgb(...base).hsluv()[2];
-    baseV = round(baseLightness / 100, 2);
-  }
-
-  const colorLum = luminance(color[0], color[1], color[2]);
-  const baseLum = luminance(base[0], base[1], base[2]);
-
-  const cr1 = (colorLum + 0.05) / (baseLum + 0.05); // will return value >=1 if color is darker than background
-  const cr2 = (baseLum + 0.05) / (colorLum + 0.05); // will return value >=1 if color is lighter than background
-
-  if (baseV < 0.5) { // Dark themes
-    // If color is darker than background, return cr1 which will be whole number
-    if (cr1 >= 1) {
+function getContrast(color, base, baseV, method='wcag2') {
+  if(method === 'wcag2') {
+    if (baseV === undefined) { // If base is an array and baseV undefined
+      const baseLightness = chroma.rgb(...base).hsluv()[2];
+      baseV = round(baseLightness / 100, 2);
+    }
+
+    const colorLum = luminance(color[0], color[1], color[2]);
+    const baseLum = luminance(base[0], base[1], base[2]);
+
+    const cr1 = (colorLum + 0.05) / (baseLum + 0.05); // will return value >=1 if color is darker than background
+    const cr2 = (baseLum + 0.05) / (colorLum + 0.05); // will return value >=1 if color is lighter than background
+
+    if (baseV < 0.5) { // Dark themes
+      // If color is darker than background, return cr1 which will be whole number
+      if (cr1 >= 1) {
+        return cr1;
+      }
+      // If color is lighter than background, return cr2 as negative whole number
+      return -cr2;
+    }
+    // Light themes
+    // If color is lighter than background, return cr2 which will be whole number
+    if (cr1 < 1) {
+      return cr2;
+    }
+    // If color is darker than background, return cr1 as negative whole number
+    if (cr1 === 1) {
       return cr1;
     }
-    // If color is lighter than background, return cr2 as negative whole number
-    return -cr2;
-  }
-  // Light themes
-  // If color is lighter than background, return cr2 which will be whole number
-  if (cr1 < 1) {
-    return cr2;
-  }
-  // If color is darker than background, return cr1 as negative whole number
-  if (cr1 === 1) {
-    return cr1;
+    return -cr1;
+  } else if (method === 'wcag3') {
+    return APCAcontrast( sRGBtoY( color ), sRGBtoY( base ) );
+  } else {
+    throw new Error(`Contrast calculation method ${method} unsupported; use 'wcag2' or 'wcag3'`);
   }
-  return -cr1;
 }
 
 function minPositive(r) {