From 935cf1c5842ada609ba9cc2e08fc7a5e8929186b Mon Sep 17 00:00:00 2001
From: Fritz Lekschas <code@lekschas.de>
Date: Mon, 10 Feb 2025 15:50:36 -0500
Subject: [PATCH 1/3] Fix: a regression from #208 where new colors wouldn't be
 set properly

Fix #214
---
 CHANGELOG.md | 4 ++++
 src/utils.js | 1 +
 2 files changed, 5 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d0c54d1..97270e8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 1.13.1
+
+- Fix: an issue where new colors wouldn't be set properly ([#214](https://github.com/flekschas/regl-scatterplot/issues/214))
+
 ## 1.13.0
 
 - Feat: add support for two new lasso types: `'rectangle'` and `'brush'`. The lasso type can be changed via `lassoType`. Additionally, for the brush lasso, you can adjust the brush size via `lassoBrushSize`. The default lasso type is `'freeform'`. ([#186](https://github.com/flekschas/regl-scatterplot/issues/186))
diff --git a/src/utils.js b/src/utils.js
index 333e02d..738af7e 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -323,6 +323,7 @@ export const isSameElements = (a, b) =>
 export const isSameRgbas = (a, b) =>
   Array.isArray(a) &&
   Array.isArray(b) &&
+  a.length === b.length &&
   a.every(([r1, g1, b1, a1], i) => {
     const [r2, g2, b2, a2] = b[i];
     return r1 === r2 && g1 === g2 && b1 === b2 && a1 === a2;

From 351d9ba7cb79da8fa2f2bfb982d64fe00b7f57d9 Mon Sep 17 00:00:00 2001
From: Fritz Lekschas <code@lekschas.de>
Date: Mon, 10 Feb 2025 15:54:12 -0500
Subject: [PATCH 2/3] test: test adding a new point color

---
 tests/get-set.test.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/tests/get-set.test.js b/tests/get-set.test.js
index 90b8a98..47d8079 100644
--- a/tests/get-set.test.js
+++ b/tests/get-set.test.js
@@ -411,6 +411,18 @@ test(
         )
     ).toBe(true);
 
+    // Add another point color to the existing point colors
+    const newPointColors = [...pointColor, [1, 0, 1, 1]];
+    scatterplot.set({
+      pointColor: newPointColors,
+    });
+
+    expect(
+      scatterplot
+        .get('pointColor')
+        .every((color, i) => color.every((c, j) => c === newPointColors[i][j]))
+    ).toBe(true);
+
     scatterplot.set({
       pointConnectionColor: ['#ff0000', '#ff00ff'],
       pointConnectionColorActive: ['#ffff00', '#0000ff'],

From e7bd022d98354697f25f1296a50546fcf00eb343 Mon Sep 17 00:00:00 2001
From: Fritz Lekschas <code@lekschas.de>
Date: Mon, 10 Feb 2025 16:05:35 -0500
Subject: [PATCH 3/3] test: add direct test for `isSameRgbas()`

---
 src/utils.js        | 21 ++++++++++++++++-----
 tests/utils.test.js | 17 ++++++++++++++++-
 2 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/src/utils.js b/src/utils.js
index 738af7e..1fe34af 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -320,14 +320,25 @@ export const isSameElements = (a, b) =>
 /**
  * Test if two arrays contain the same RGBA quadruples
  */
-export const isSameRgbas = (a, b) =>
-  Array.isArray(a) &&
-  Array.isArray(b) &&
-  a.length === b.length &&
-  a.every(([r1, g1, b1, a1], i) => {
+export const isSameRgbas = (a, b) => {
+  if (!(Array.isArray(a) && Array.isArray(b)) || a.length !== b.length) {
+    return false;
+  }
+
+  if (a.length === 0) {
+    return true;
+  }
+
+  // We need to test whether a and b are arrays of RGBA quadruples
+  if (!(Array.isArray(a[0]) && Array.isArray(b[0]))) {
+    return false;
+  }
+
+  return a.every(([r1, g1, b1, a1], i) => {
     const [r2, g2, b2, a2] = b[i];
     return r1 === r2 && g1 === g2 && b1 === b2 && a1 === a2;
   });
+};
 
 /**
  * Fast version of `Math.max`. Based on
diff --git a/tests/utils.test.js b/tests/utils.test.js
index 1960aec..f507cf8 100644
--- a/tests/utils.test.js
+++ b/tests/utils.test.js
@@ -5,7 +5,12 @@ import { expect, test } from 'vitest';
 
 import { checkSupport } from '../src';
 
-import { toRgba, isNormFloatArray, isValidBBox } from '../src/utils';
+import {
+  toRgba,
+  isNormFloatArray,
+  isValidBBox,
+  isSameRgbas,
+} from '../src/utils';
 
 const EPS = 1e-7;
 
@@ -51,3 +56,13 @@ test('toRgba()', () => {
 test('checkSupport()', () => {
   expect(checkSupport() === true || checkSupport() === false).toBe(true);
 });
+
+test('isSameRgbas()', () => {
+  expect(isSameRgbas('#ff0000', [[0, 1, 1, 1]])).toBe(false);
+  expect(isSameRgbas([[0, 1, 1, 1]], '#ff0000')).toBe(false);
+  expect(isSameRgbas([0, 1, 1, 1], [0, 1, 1, 1])).toBe(false);
+  expect(isSameRgbas([[0, 1, 1, 1], [1, 1, 0, 0]], [[0, 1, 1, 1]])).toBe(false);
+  expect(isSameRgbas([[0, 1, 1, 1]], [[0, 1, 1, 1], [1, 1, 0, 0]])).toBe(false);
+  expect(isSameRgbas([[0, 1, 1, 1]], [[1, 1, 1, 1]])).toBe(false);
+  expect(isSameRgbas([[0, 1, 1, 1]], [[0, 1, 1, 1]])).toBe(true);
+});