From 21ed2b3538b3cb7478a153ebbf062617a8c4cfc8 Mon Sep 17 00:00:00 2001
From: Josefina Mancilla <josefinanoemi4@gmail.com>
Date: Tue, 10 Aug 2021 15:07:01 -0500
Subject: [PATCH] test(tag): add vrt

---
 .../react/src/components/Tag/Tag-test.e2e.js  | 53 +++++++++++++++++++
 1 file changed, 53 insertions(+)
 create mode 100644 packages/react/src/components/Tag/Tag-test.e2e.js

diff --git a/packages/react/src/components/Tag/Tag-test.e2e.js b/packages/react/src/components/Tag/Tag-test.e2e.js
new file mode 100644
index 000000000000..4d7081071167
--- /dev/null
+++ b/packages/react/src/components/Tag/Tag-test.e2e.js
@@ -0,0 +1,53 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import 'carbon-components/scss/components/tag/_tag.scss';
+
+import React from 'react';
+import { mount } from '@cypress/react';
+import Tag from './Tag';
+import TagSkeleton from './Tag.Skeleton';
+import { Tag16 } from '@carbon/icons-react';
+
+describe('Tag', () => {
+  beforeEach(() => {
+    mount(
+      <>
+        <Tag>This is a tag</Tag>
+        <Tag onClick={() => {}}>This is an interactive tag</Tag>
+        <Tag size="sm">This is a small tag</Tag>
+        <Tag filter>This is a filter tag</Tag>
+        <Tag renderIcon={Tag16}>Custom icon</Tag>
+        <Tag filter disabled>
+          Disabled filter tag
+        </Tag>
+        <Tag type="magenta">magenta</Tag>
+        <Tag type="red">red</Tag>
+        <Tag type="purple">purple</Tag>
+        <Tag type="blue">blue</Tag>
+        <Tag type="cyan">cyan</Tag>
+        <Tag type="teal">teal</Tag>
+        <Tag type="green">green</Tag>
+        <Tag type="gray">gray</Tag>
+        <Tag type="cool-gray">cool-gray</Tag>
+        <Tag type="warm-gray">warm-gray</Tag>
+        <Tag type="high-contrast">high-contrast</Tag>
+        <TagSkeleton />
+        <TagSkeleton size="sm" />
+      </>
+    );
+  });
+
+  it('should render', () => {
+    cy.findByText(/warm-gray/).should('be.visible');
+
+    // snapshots should always be taken _after_ an assertion that
+    // a element/component should be visible. This is to ensure
+    // the DOM has settled and the element has fully loaded.
+    cy.percySnapshot();
+  });
+});