fix(Tag): incorrect border color when using plain (#8601)

* fix(Tag): incorrect border color when using plain

* fix: snapshot

src/tag/Tag.tsx

@@ -36,6 +36,7 @@ export default defineComponent({
       if (props.plain) {
         return {
           color: props.textColor || props.color,
+          borderColor: props.color,
         };
       }
       return {

src/tag/index.less

@@ -52,6 +52,7 @@
 
   &--plain {
     background-color: @tag-plain-background-color;
+    border-color: currentColor;
 
     &::before {
       position: absolute;
@@ -59,7 +60,8 @@
       right: 0;
       bottom: 0;
       left: 0;
-      border: 1px solid currentColor;
+      border: 1px solid;
+      border-color: inherit;
       border-radius: inherit;
       content: '';
       pointer-events: none;

src/tag/test/__snapshots__/demo.spec.ts.snap

@@ -204,7 +204,7 @@ exports[`should render demo and match snapshot 1`] = `
     </div>
     <div class="van-cell__value">
       <transition-stub>
-        <span style="color: rgb(114, 50, 221);"
+        <span style="color: rgb(114, 50, 221); border-color: #7232dd;"
               class="van-tag van-tag--plain van-tag--default"
         >
           Tag

src/tag/test/__snapshots__/index.spec.ts.snap

@@ -4,3 +4,12 @@ exports[`should hide tag when the show prop is false 1`] = `
 <transition-stub>
 </transition-stub>
 `;
+
+exports[`should render border-color correctly 1`] = `
+<transition-stub>
+  <span style="color: blue; border-color: red;"
+        class="van-tag van-tag--plain van-tag--default"
+  >
+  </span>
+</transition-stub>
+`;

src/tag/test/index.spec.ts

@@ -36,3 +36,15 @@ test('should not trigger click event when clicking the close icon', () => {
   wrapper.trigger('click');
   expect(onClick).toHaveBeenCalledTimes(1);
 });
+
+test('should render border-color correctly', () => {
+  const wrapper = mount(Tag, {
+    props: {
+      plain: true,
+      color: 'red',
+      textColor: 'blue',
+    },
+  });
+
+  expect(wrapper.html()).toMatchSnapshot();
+});