diff --git a/docs/docs/shapes/vertices.md b/docs/docs/shapes/vertices.md
index 827ee4a894..ada150c53b 100644
--- a/docs/docs/shapes/vertices.md
+++ b/docs/docs/shapes/vertices.md
@@ -10,7 +10,7 @@ Draws vertices.
| Name | Type | Description |
| :--------- | :----------- | :----------------------- |
| vertices | `Point[]` | Vertices to draw |
-| mode? | `VertexMode` | Can be `triangles`, `trianglesStrip` or `triangleFan`. Default is `triangles` |
+| mode? | `VertexMode` | Can be `triangles`, `triangleStrip` or `triangleFan`. Default is `triangles` |
| indices? | `number[]` | Indices of the vertices that form the triangles. If not provided, the order of the vertices will be taken. Using this property enables you not to duplicate vertices. |
| textures | `Point[]`. | [Texture mapping](https://en.wikipedia.org/wiki/Texture_mapping). The texture is the shader provided by the paint. |
| colors? | `string[]` | Optional colors to be associated to each vertex |
diff --git a/package/src/__tests__/snapshots/vertices/strip.png b/package/src/__tests__/snapshots/vertices/strip.png
new file mode 100644
index 0000000000..d1291793e0
Binary files /dev/null and b/package/src/__tests__/snapshots/vertices/strip.png differ
diff --git a/package/src/__tests__/snapshots/vertices/vertices.png b/package/src/__tests__/snapshots/vertices/vertices.png
new file mode 100644
index 0000000000..1190272231
Binary files /dev/null and b/package/src/__tests__/snapshots/vertices/vertices.png differ
diff --git a/package/src/renderer/__tests__/e2e/Vertices.spec.tsx b/package/src/renderer/__tests__/e2e/Vertices.spec.tsx
new file mode 100644
index 0000000000..916de23f37
--- /dev/null
+++ b/package/src/renderer/__tests__/e2e/Vertices.spec.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+import { checkImage } from "../../../__tests__/setup";
+import { Vertices } from "../../components";
+import { surface, importSkia } from "../setup";
+
+describe("Vertices", () => {
+ it("should draw a single triangle", async () => {
+ const { vec } = importSkia();
+ const vertices = [vec(64, 0), vec(128, 256), vec(0, 256)];
+ const colors = ["#61dafb", "#fb61da", "#dafb61"];
+ const img = await surface.draw(
+ <>
+
+ >
+ );
+ checkImage(img, "snapshots/vertices/vertices.png");
+ });
+ it("should draw a single triangle strip", async () => {
+ const { vec } = importSkia();
+ const vertices = [vec(0, 0), vec(128, 0), vec(0, 256), vec(128, 256)];
+ const colors = ["#61dafb", "#fb61da", "#dafb61", "cyan"];
+ const img = await surface.draw(
+ <>
+
+ >
+ );
+ checkImage(img, "snapshots/vertices/strip.png");
+ });
+});
diff --git a/package/src/skia/__tests__/Enums.spec.ts b/package/src/skia/__tests__/Enums.spec.ts
index c02229b634..cbb09c3547 100644
--- a/package/src/skia/__tests__/Enums.spec.ts
+++ b/package/src/skia/__tests__/Enums.spec.ts
@@ -95,7 +95,11 @@ describe("Enums", () => {
});
it("Should match VertexMode enums values with CanvasKit", () => {
const { CanvasKit } = setupSkia();
- checkEnum(VertexMode, CanvasKit.VertexMode);
+ expect(VertexMode.TriangleFan).toBe(CanvasKit.VertexMode.TriangleFan.value);
+ expect(VertexMode.TriangleStrip).toBe(
+ CanvasKit.VertexMode.TrianglesStrip.value
+ );
+ expect(VertexMode.Triangles).toBe(CanvasKit.VertexMode.Triangles.value);
});
it("Should match Canvas enums values with CanvasKit", () => {
const { CanvasKit } = setupSkia();
diff --git a/package/src/skia/types/Vertices/Vertices.tsx b/package/src/skia/types/Vertices/Vertices.tsx
index 49f023d7a0..a1b098e1e4 100644
--- a/package/src/skia/types/Vertices/Vertices.tsx
+++ b/package/src/skia/types/Vertices/Vertices.tsx
@@ -3,7 +3,7 @@ import type { SkJSIInstance } from "../JsiInstance";
export enum VertexMode {
Triangles,
- TrianglesStrip,
+ TriangleStrip,
TriangleFan,
}