23689953389

Committed 28 Mar 2026 05:00PM UTC coverage: 79.878% (-11.0%) from 90.907%

Build # 23689953389

Build Type

push

github

Committed by

web-flow

Commit Message

chore(test): vitest migration (#9969)

Coverage Stats

3050 of 3709 branches covered (82.23%)

Branch coverage included in aggregate %.

131 of 169 new or added lines in 11 files covered. (77.51%)

171 existing lines in 60 files now uncovered.

13988 of 17621 relevant lines covered (79.38%)

26917.67 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

96.43

/modules/layers/src/text-layer/text-background-layer/text-background-layer.ts

// deck.gl
// SPDX-License-Identifier: MIT
// Copyright (c) vis.gl contributors

import {Layer, project32, picking, UNIT} from '@deck.gl/core';
import {Geometry} from '@luma.gl/engine';
import {Model} from '@luma.gl/engine';

import {TextBackgroundProps, textBackgroundUniforms} from './text-background-layer-uniforms';
import {TextModuleProps, textUniforms} from '../text-uniforms';
import vs from './text-background-layer-vertex.glsl';
import fs from './text-background-layer-fragment.glsl';

import type {
  LayerProps,
  LayerDataSource,
  Accessor,
  Unit,
  Position,
  Color,
  UpdateParameters,
  DefaultProps
} from '@deck.gl/core';

type _TextBackgroundLayerProps<DataT> = {
  data: LayerDataSource<DataT>;
  billboard?: boolean;
  sizeScale?: number;
  sizeUnits?: Unit;
  sizeMinPixels?: number;
  sizeMaxPixels?: number;

  borderRadius?: number | Readonly<[number, number, number, number]>;
  padding?: Readonly<[number, number]> | Readonly<[number, number, number, number]>;

  getPosition?: Accessor<DataT, Position>;
  getSize?: Accessor<DataT, number>;
  getAngle?: Accessor<DataT, number>;
  getPixelOffset?: Accessor<DataT, Readonly<[number, number]>>;
  getBoundingRect?: Accessor<DataT, Readonly<[number, number, number, number]>>;
  getClipRect?: Accessor<DataT, [x: number, y: number, width: number, height: number]>;
  getFillColor?: Accessor<DataT, Color>;
  getLineColor?: Accessor<DataT, Color>;
  getLineWidth?: Accessor<DataT, number>;
};

export type TextBackgroundLayerProps<DataT = unknown> = _TextBackgroundLayerProps<DataT> &
  LayerProps;

const defaultProps: DefaultProps<TextBackgroundLayerProps> = {
  billboard: true,
  sizeScale: 1,
  sizeUnits: 'pixels',
  sizeMinPixels: 0,
  sizeMaxPixels: Number.MAX_SAFE_INTEGER,

  borderRadius: {type: 'object', value: 0},
  padding: {type: 'array', value: [0, 0, 0, 0]},

  getPosition: {type: 'accessor', value: (x: any) => x.position},
  getSize: {type: 'accessor', value: 1},
  getAngle: {type: 'accessor', value: 0},
  getPixelOffset: {type: 'accessor', value: [0, 0]},
  getBoundingRect: {type: 'accessor', value: [0, 0, 0, 0]},
  getClipRect: {type: 'accessor', value: [0, 0, -1, -1]},
  getFillColor: {type: 'accessor', value: [0, 0, 0, 255]},
  getLineColor: {type: 'accessor', value: [0, 0, 0, 255]},
  getLineWidth: {type: 'accessor', value: 1}
};

export default class TextBackgroundLayer<DataT = any, ExtraPropsT extends {} = {}> extends Layer<
  ExtraPropsT & Required<_TextBackgroundLayerProps<DataT>>
> {
  static defaultProps = defaultProps;
  static layerName = 'TextBackgroundLayer';

  state!: {
    model?: Model;
  };

  getShaders() {
    return super.getShaders({
      vs,
      fs,
      modules: [project32, picking, textBackgroundUniforms, textUniforms]
    });
  }

  initializeState() {
    this.getAttributeManager()!.addInstanced({
      instancePositions: {
        size: 3,
        type: 'float64',
        fp64: this.use64bitPositions(),
        transition: true,
        accessor: 'getPosition'
      },
      instanceSizes: {
        size: 1,
        transition: true,
        accessor: 'getSize',
        defaultValue: 1
      },
      instanceAngles: {
        size: 1,
        transition: true,
        accessor: 'getAngle'
      },
      instanceRects: {
        size: 4,
        accessor: 'getBoundingRect'
      },
      instanceClipRect: {
        size: 4,
        accessor: 'getClipRect',
        defaultValue: [0, 0, -1, -1]
      },
      instancePixelOffsets: {
        size: 2,
        transition: true,
        accessor: 'getPixelOffset'
      },
      instanceFillColors: {
        size: 4,
        transition: true,
        type: 'unorm8',
        accessor: 'getFillColor',
        defaultValue: [0, 0, 0, 255]
      },
      instanceLineColors: {
        size: 4,
        transition: true,
        type: 'unorm8',
        accessor: 'getLineColor',
        defaultValue: [0, 0, 0, 255]
      },
      instanceLineWidths: {
        size: 1,
        transition: true,
        accessor: 'getLineWidth',
        defaultValue: 1
      }
    });
  }

  updateState(params: UpdateParameters<this>) {
    super.updateState(params);
    const {changeFlags} = params;
    if (changeFlags.extensionsChanged) {
      this.state.model?.destroy();
      this.state.model = this._getModel();
      this.getAttributeManager()!.invalidateAll();
    }
  }

  draw({uniforms}) {
    const {billboard, sizeScale, sizeUnits, sizeMinPixels, sizeMaxPixels, getLineWidth} =
      this.props;
    let {padding, borderRadius} = this.props;

    if (padding.length < 4) {
      padding = [padding[0], padding[1], padding[0], padding[1]];
    }

    if (!Array.isArray(borderRadius)) {
      borderRadius = [
        borderRadius as number,
        borderRadius as number,
        borderRadius as number,
        borderRadius as number
      ];
    }

    const model = this.state.model!;
    const textBackgroundProps: TextBackgroundProps = {
      billboard,
      stroked: Boolean(getLineWidth),
      borderRadius: borderRadius as [number, number, number, number],
      padding: padding as [number, number, number, number],
      sizeUnits: UNIT[sizeUnits],
      sizeScale,
      sizeMinPixels,
      sizeMaxPixels
    };
    const textProps: TextModuleProps = {
      viewport: this.context.viewport
    };
    model.shaderInputs.setProps({textBackground: textBackgroundProps, text: textProps});
    model.draw(this.context.renderPass);
  }

  protected _getModel(): Model {
    // a square that minimally cover the unit circle
    const positions = [0, 0, 1, 0, 0, 1, 1, 1];

    return new Model(this.context.device, {
      ...this.getShaders(),
      id: this.props.id,
      bufferLayout: this.getAttributeManager()!.getBufferLayouts(),
      geometry: new Geometry({
        topology: 'triangle-strip',
        vertexCount: 4,
        attributes: {
          positions: {size: 2, value: new Float32Array(positions)}
        }
      }),
      isInstanced: true
    });
  }
}

1	// deck.gl
2	// SPDX-License-Identifier: MIT
3	// Copyright (c) vis.gl contributors
4
5	import {Layer, project32, picking, UNIT} from '@deck.gl/core';
6	import {Geometry} from '@luma.gl/engine';
7	import {Model} from '@luma.gl/engine';
8
9	import {TextBackgroundProps, textBackgroundUniforms} from './text-background-layer-uniforms';
10	import {TextModuleProps, textUniforms} from '../text-uniforms';
11	import vs from './text-background-layer-vertex.glsl';
12	import fs from './text-background-layer-fragment.glsl';
13
14	import type {
15	LayerProps,
16	LayerDataSource,
17	Accessor,
18	Unit,
19	Position,
20	Color,
21	UpdateParameters,
22	DefaultProps
23	} from '@deck.gl/core';
24
25	type _TextBackgroundLayerProps<DataT> = {
26	data: LayerDataSource<DataT>;
27	billboard?: boolean;
28	sizeScale?: number;
29	sizeUnits?: Unit;
30	sizeMinPixels?: number;
31	sizeMaxPixels?: number;
32
33	borderRadius?: number \| Readonly<[number, number, number, number]>;
34	padding?: Readonly<[number, number]> \| Readonly<[number, number, number, number]>;
35
36	getPosition?: Accessor<DataT, Position>;
37	getSize?: Accessor<DataT, number>;
38	getAngle?: Accessor<DataT, number>;
39	getPixelOffset?: Accessor<DataT, Readonly<[number, number]>>;
40	getBoundingRect?: Accessor<DataT, Readonly<[number, number, number, number]>>;
41	getClipRect?: Accessor<DataT, [x: number, y: number, width: number, height: number]>;
42	getFillColor?: Accessor<DataT, Color>;
43	getLineColor?: Accessor<DataT, Color>;
44	getLineWidth?: Accessor<DataT, number>;
45	};
46
47	export type TextBackgroundLayerProps<DataT = unknown> = _TextBackgroundLayerProps<DataT> &
48	LayerProps;
49
50	const defaultProps: DefaultProps<TextBackgroundLayerProps> = {	4✔
51	billboard: true,
52	sizeScale: 1,
53	sizeUnits: 'pixels',
54	sizeMinPixels: 0,
55	sizeMaxPixels: Number.MAX_SAFE_INTEGER,
56
57	borderRadius: {type: 'object', value: 0},
58	padding: {type: 'array', value: [0, 0, 0, 0]},
59
UNCOV 60	getPosition: {type: 'accessor', value: (x: any) => x.position},	×
61	getSize: {type: 'accessor', value: 1},
62	getAngle: {type: 'accessor', value: 0},
63	getPixelOffset: {type: 'accessor', value: [0, 0]},
64	getBoundingRect: {type: 'accessor', value: [0, 0, 0, 0]},
65	getClipRect: {type: 'accessor', value: [0, 0, -1, -1]},
66	getFillColor: {type: 'accessor', value: [0, 0, 0, 255]},
67	getLineColor: {type: 'accessor', value: [0, 0, 0, 255]},
68	getLineWidth: {type: 'accessor', value: 1}
69	};
70
71	export default class TextBackgroundLayer<DataT = any, ExtraPropsT extends {} = {}> extends Layer<
72	ExtraPropsT & Required<_TextBackgroundLayerProps<DataT>>
73	> {
74	static defaultProps = defaultProps;	4✔
75	static layerName = 'TextBackgroundLayer';	4✔
76
77	state!: {
78	model?: Model;
79	};
80
81	getShaders() {
82	return super.getShaders({	6✔
83	vs,
84	fs,
85	modules: [project32, picking, textBackgroundUniforms, textUniforms]
86	});
87	}
88
89	initializeState() {
90	this.getAttributeManager()!.addInstanced({	5✔
91	instancePositions: {
92	size: 3,
93	type: 'float64',
94	fp64: this.use64bitPositions(),
95	transition: true,
96	accessor: 'getPosition'
97	},
98	instanceSizes: {
99	size: 1,
100	transition: true,
101	accessor: 'getSize',
102	defaultValue: 1
103	},
104	instanceAngles: {
105	size: 1,
106	transition: true,
107	accessor: 'getAngle'
108	},
109	instanceRects: {
110	size: 4,
111	accessor: 'getBoundingRect'
112	},
113	instanceClipRect: {
114	size: 4,
115	accessor: 'getClipRect',
116	defaultValue: [0, 0, -1, -1]
117	},
118	instancePixelOffsets: {
119	size: 2,
120	transition: true,
121	accessor: 'getPixelOffset'
122	},
123	instanceFillColors: {
124	size: 4,
125	transition: true,
126	type: 'unorm8',
127	accessor: 'getFillColor',
128	defaultValue: [0, 0, 0, 255]
129	},
130	instanceLineColors: {
131	size: 4,
132	transition: true,
133	type: 'unorm8',
134	accessor: 'getLineColor',
135	defaultValue: [0, 0, 0, 255]
136	},
137	instanceLineWidths: {
138	size: 1,
139	transition: true,
140	accessor: 'getLineWidth',
141	defaultValue: 1
142	}
143	});
144	}
145
146	updateState(params: UpdateParameters<this>) {
147	super.updateState(params);	89✔
148	const {changeFlags} = params;	89✔
149	if (changeFlags.extensionsChanged) {	89✔
150	this.state.model?.destroy();	5✔
151	this.state.model = this._getModel();	5✔
152	this.getAttributeManager()!.invalidateAll();	5✔
153	}
154	}
155
156	draw({uniforms}) {
157	const {billboard, sizeScale, sizeUnits, sizeMinPixels, sizeMaxPixels, getLineWidth} =
158	this.props;	133✔
159	let {padding, borderRadius} = this.props;	133✔
160
161	if (padding.length < 4) {	133✔
162	padding = [padding[0], padding[1], padding[0], padding[1]];	2✔
163	}
164
165	if (!Array.isArray(borderRadius)) {	133✔
166	borderRadius = [	131✔
167	borderRadius as number,
168	borderRadius as number,
169	borderRadius as number,
170	borderRadius as number
171	];
172	}
173
174	const model = this.state.model!;	133✔
175	const textBackgroundProps: TextBackgroundProps = {	133✔
176	billboard,
177	stroked: Boolean(getLineWidth),
178	borderRadius: borderRadius as [number, number, number, number],
179	padding: padding as [number, number, number, number],
180	sizeUnits: UNIT[sizeUnits],
181	sizeScale,
182	sizeMinPixels,
183	sizeMaxPixels
184	};
185	const textProps: TextModuleProps = {	133✔
186	viewport: this.context.viewport
187	};
188	model.shaderInputs.setProps({textBackground: textBackgroundProps, text: textProps});	133✔
189	model.draw(this.context.renderPass);	133✔
190	}
191
192	protected _getModel(): Model {
193	// a square that minimally cover the unit circle
194	const positions = [0, 0, 1, 0, 0, 1, 1, 1];	5✔
195
196	return new Model(this.context.device, {	5✔
197	...this.getShaders(),
198	id: this.props.id,
199	bufferLayout: this.getAttributeManager()!.getBufferLayouts(),
200	geometry: new Geometry({
201	topology: 'triangle-strip',
202	vertexCount: 4,
203	attributes: {
204	positions: {size: 2, value: new Float32Array(positions)}
205	}
206	}),
207	isInstanced: true
208	});
209	}
210	}

visgl / deck.gl / 23689953389

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous