From 71bc59f35c0c04cf705356cb433d290e6bdcffc4 Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Thu, 13 Jun 2019 22:23:36 -0700
Subject: [PATCH] Add debug info to the DOM

---
 experiments/modern/src/App.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/experiments/modern/src/App.js b/experiments/modern/src/App.js
index 42d68afd..5c57440d 100644
--- a/experiments/modern/src/App.js
+++ b/experiments/modern/src/App.js
@@ -57,6 +57,8 @@ function Layout({
   return (
     <>
       <img
+        data-node-type="layout"
+        data-node-id={id}
         src={image.imgUrl}
         style={{
           minWidth: Number(minimum_w),
@@ -77,6 +79,8 @@ function Layer({ id, image, children, x, y }) {
   return (
     <>
       <img
+        data-node-type="Layer"
+        data-node-id={id}
         src={img.imgUrl}
         style={{ position: "absolute", top: Number(y), left: Number(x) }}
       />
@@ -93,6 +97,8 @@ function Button({ id, image, action, x, y, downImage, tooltip, children }) {
   const img = data[imgId.toLowerCase()];
   return (
     <div
+      data-node-type="button"
+      data-node-id={id}
       onMouseDown={e => {
         setDown(true);
         document.addEventListener("mouseup", () => {