diff --git a/packages/dev-tools-pages/ts/components/Code.tsx b/packages/dev-tools-pages/ts/components/Code.tsx
index 6675422efb..f83d16dfa8 100644
--- a/packages/dev-tools-pages/ts/components/Code.tsx
+++ b/packages/dev-tools-pages/ts/components/Code.tsx
@@ -90,7 +90,7 @@ const StyledCodeDiff = styled(({ gutterLength, children, ...props }: any) => <co
         padding-left: calc(2.25rem + ${props => props.gutterLength}ch);
 
         ::before {
-            content: attr(data-test);
+            content: attr(data-gutter);
 
             width: ${props => props.gutterLength};
             padding-left: 0.375rem;
diff --git a/packages/dev-tools-pages/ts/highlight.tsx b/packages/dev-tools-pages/ts/highlight.tsx
index 64c5f9a17f..6efba02f82 100644
--- a/packages/dev-tools-pages/ts/highlight.tsx
+++ b/packages/dev-tools-pages/ts/highlight.tsx
@@ -31,7 +31,7 @@ function diffHighlight(language: string, code: any, gutter: any) {
 
             const g = gutter[index];
 
-            return `<span data-test="${g !== undefined ? g + 'x' : ''}" class="line-${type}">${
+            return `<span data-gutter="${g !== undefined ? g + 'x' : ''}" class="line-${type}">${
                 hljs.highlight(language, line).value
             }</span>`;
         })