test: expand runtime tests to cover faceted/repeated views

test-runtime/index.html

@@ -45,15 +45,6 @@
         target.dispatchEvent(type === 'wheel' ? new WheelEvent('wheel', opts) : new MouseEvent(type, opts));
       }
 
-      function pureClear(id, parent, targetBrush) {
-        const el0 = mark(id, parent);
-        const [clientX, clientY] = coords(el0);
-
-        pureMouseEvt('mousedown', el0, {clientX, clientY});
-        pureMouseEvt('mouseup', window, {clientX, clientY});
-        pureMouseEvt('click', el0, {clientX, clientY});
-      }
-
       function mark(id, parent) {
         return document.querySelector((parent ? `g.${parent} ` : '') + `g.mark-symbol.role-mark path:nth-child(${id})`);
       }

test-runtime/region.test.ts

@@ -1,6 +1,6 @@
 import {TopLevelSpec} from '../src';
 import {SELECTION_ID, SelectionType} from '../src/selection';
-import {clear, embedFn, circleRegion, polygonRegion, spec, testRenderFn, hits} from './util';
+import {clearRegion, embedFn, circleRegion, polygonRegion, spec, testRenderFn, hits} from './util';
 import {Page} from 'puppeteer/lib/cjs/puppeteer/common/Page';
 
 describe('region selections at runtime in unit views', () => {
@@ -60,8 +60,8 @@ describe('region selections at runtime in unit views', () => {
     let store = await page.evaluate(circleRegion(hit.id));
     expect(store).toHaveLength(hit.count);
 
-    store = await page.evaluate(clear(hits.region.circle_clear[0].id));
-    expect(store).toBeUndefined();
+    store = await page.evaluate(clearRegion(hits.region.circle_clear[0].id));
+    expect(store).toHaveLength(0);
 
     await testRender(`clear_0`);
   });

test-runtime/resolve.test.ts

@@ -3,6 +3,7 @@ import {
   compositeTypes,
   embedFn,
   hits as hitsMaster,
+  multiviewRegion,
   parentSelector,
   pt,
   resolutions,
@@ -14,10 +15,15 @@ import {
 import {Page} from 'puppeteer/lib/cjs/puppeteer/common/Page';
 import {TopLevelSpec} from '../src';
 
+const fns = {
+  point: pt,
+  interval: brush,
+  region: multiviewRegion
+};
+
 for (const type of selectionTypes) {
-  const isInterval = type === 'interval';
   const hits = hitsMaster[type];
-  const fn = isInterval ? brush : pt;
+  const fn = fns[type];
 
   describe(`${type} selections at runtime`, () => {
     let page: Page;
@@ -49,7 +55,7 @@ for (const type of selectionTypes) {
           const selection = {
             type,
             resolve: 'global',
-            ...(specType === 'facet' ? {encodings: ['y']} : {})
+            ...(specType === 'facet' && type !== 'region' ? {encodings: ['y']} : {})
           };
 
           for (let i = 0; i < hits[specType].length; i++) {
@@ -72,7 +78,7 @@ for (const type of selectionTypes) {
           const selection = {
             type,
             resolve,
-            ...(specType === 'facet' ? {encodings: ['x']} : {})
+            ...(specType === 'facet' && type !== 'region' ? {encodings: ['x']} : {})
           };
 
           /**

test-runtime/util.ts

@@ -10,7 +10,7 @@ const generate = process.env.VL_GENERATE_TESTS;
 const output = 'test-runtime/resources';
 
 export type ComposeType = 'unit' | 'repeat' | 'facet';
-export const selectionTypes: SelectionType[] = ['point', 'interval'];
+export const selectionTypes: SelectionType[] = ['point', 'interval', 'region'];
 export const compositeTypes: ComposeType[] = ['repeat', 'facet'];
 export const resolutions: SelectionResolution[] = ['union', 'intersect'];
 
@@ -139,7 +139,13 @@ export const hits = {
         ],
         count: 2
       }
-    ]
+    ],
+
+    facet: [2, 4, 7],
+    facet_clear: [3, 5, 8],
+
+    repeat: [5, 10, 16],
+    repeat_clear: [13, 14, 2]
   }
 };
 
@@ -294,8 +300,8 @@ export function parentSelector(compositeType: ComposeType, index: number) {
   return compositeType === 'facet' ? `cell > g:nth-child(${index + 1})` : `${UNIT_NAMES.repeat[index]}_group`;
 }
 
-export function clear(idx: number, parent?: string, targetBrush?: boolean) {
-  return `pureClear(${idx}, ${stringValue(parent)}, ${!!targetBrush})`;
+export function clearRegion(idx: number, parent?: string, targetBrush?: boolean) {
+  return `clear(${idx}, ${stringValue(parent)}, ${!!targetBrush})`;
 }
 
 export function circleRegion(idx: number, parent?: string, targetBrush?: boolean, radius = 40, segments = 20) {
@@ -306,6 +312,12 @@ export function polygonRegion(idx: number, polygon: number[][], parent?: string,
   return `polygonRegion(${idx}, ${JSON.stringify(polygon)}, ${stringValue(parent)}, ${!!targetBrush})`;
 }
 
+export function multiviewRegion(key: string, idx: number, parent?: string, targetBrush?: boolean) {
+  return key.match('_clear')
+    ? clearRegion(hits.region[key][idx], parent, targetBrush)
+    : circleRegion(hits.region[key][idx], parent, targetBrush, 10);
+}
+
 export function brush(key: string, idx: number, parent?: string, targetBrush?: boolean) {
   const fn = key.match('_clear') ? 'clear' : 'brush';
   return `${fn}(${hits.interval[key][idx].join(', ')}, ${stringValue(parent)}, ${!!targetBrush})`;