@empiricalrun/test-gen 0.42.12 → 0.42.13

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @empiricalrun/test-gen
 
+## 0.42.13
+
+### Patch Changes
+
+- 161b404: fix: added colors in annnotations
+
 ## 0.42.12
 
 ### Patch Changes

package/dist/browser-injected-scripts/annotate-elements.js

@@ -301,7 +301,13 @@ function annotateElementsWithPreference({
   var parentElements = [];
 
   // Create a hint marker
-  function createHintMarker(el, hint, parentElement, windowToAnnotate) {
+  function createHintMarker(
+    el,
+    hint,
+    parentElement,
+    windowToAnnotate,
+    baseColor,
+  ) {
     const rect = el.getBoundingClientRect();
 
     // Create the marker element
@@ -311,10 +317,10 @@ function annotateElementsWithPreference({
     // Style the marker
     Object.assign(marker.style, {
       position: "absolute",
-      background: "rgb(255, 197, 66)",
+      background: baseColor,
       padding: "1px 3px 0px",
       borderRadius: "3px",
-      border: "1px solid rgb(227, 190, 35)",
+      border: `1px solid ${baseColor}`,
       fontSize: "11px",
       pointerEvents: "none",
       zIndex: "10000",
@@ -324,10 +330,9 @@ function annotateElementsWithPreference({
       letterSpacing: 0,
       minHeight: 0,
       lineHeight: "100%",
-      color: "rgb(48, 37, 5)",
+      color: "white",
       fontFamily: "Helvetica, Arial, sans-serif",
       fontWeight: "bold",
-      textShadow: "rgba(255, 255, 255, 0.6) 0px 1px 0px",
       visibility: "hidden", // Setting the visibility to hidden initially, to get the height and width of marker
     });
 
@@ -475,9 +480,27 @@ function annotateElementsWithPreference({
       const hint = hints[index];
       const rect = el.getBoundingClientRect();
 
+      const colors = [
+        "#FF0000", // Red
+        "#006400", // Dark Green
+        "#0000FF", // Blue
+        "#FFA500", // Orange
+        "#800080", // Purple
+        "#008080", // Teal
+        "#FF69B4", // Hot Pink
+        "#4B0082", // Indigo
+        "#FF4500", // Orange Red
+        "#2E8B57", // Sea Green
+        "#DC143C", // Crimson
+        "#4682B4", // Steel Blue
+      ];
+      const colorIndex = index % colors.length;
+      const baseColor = colors[colorIndex];
+
       // Use createHintMarker with the specified container
-      createHintMarker(el, hint, container, windowToAnnotate);
-      el.style.boxShadow = `inset 0 0 0px 1px red`;
+      createHintMarker(el, hint, container, windowToAnnotate, baseColor);
+
+      el.style.boxShadow = `inset 0 0 0px 2px ${baseColor}`;
 
       // Add element details to the annotations map
       annotationsMap[hint] = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@empiricalrun/test-gen",
-  "version": "0.42.12",
+  "version": "0.42.13",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
@@ -73,8 +73,8 @@
     "tsx": "^4.16.2",
     "typescript": "^5.3.3",
     "@empiricalrun/llm": "^0.9.31",
-    "@empiricalrun/r2-uploader": "^0.3.8",
-    "@empiricalrun/reporter": "^0.23.0"
+    "@empiricalrun/reporter": "^0.23.0",
+    "@empiricalrun/r2-uploader": "^0.3.8"
   },
   "devDependencies": {
     "@playwright/test": "1.47.1",