From 49387fb4af21a392c5c1316bfd26dfebcf62d8f2 Mon Sep 17 00:00:00 2001
From: Putra Bonaccorsi <putra.roeung@gmail.com>
Date: Wed, 2 Mar 2022 17:22:55 -0500
Subject: [PATCH] fix(content-block-horizontal): ensure border attribute
 returns correctly (#8382)

### Related Ticket(s)

https://github.com/carbon-design-system/carbon-for-ibm-dotcom/issues/8348

### Description

- This PR ensures that when the `border` attribute/prop is defined in the `<dds-content-block-horizontal>` component that the border-bottom renders and is hidden when it's not defined.
- See the issue for more detail of the current behavior seen by the AEM adopters - https://github.com/carbon-design-system/carbon-for-ibm-dotcom/issues/8348

### Changelog

**Changed**

- Ensure that the `border` attribute is defined
- Set border default prop to `false`.

### Testing

- Visit the `Content Block Horizontal` layout component code sandbox
- Add `border` to the `<dds-content-block-horizontal>` element (eg. `<dds-content-block-horizontal border>` and ensure that the border-bottom renders correctly.
- If the `border` attribute is not being used, ensure that the border-bottom does not get rendered.

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
---
 .../content-block-horizontal/content-block-horizontal.ts    | 6 +++---
 .../tests/snapshots/dds-content-block-horizontal.md         | 4 ----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/packages/web-components/src/components/content-block-horizontal/content-block-horizontal.ts b/packages/web-components/src/components/content-block-horizontal/content-block-horizontal.ts
index a3d9050c6e1..cd03e0135cb 100644
--- a/packages/web-components/src/components/content-block-horizontal/content-block-horizontal.ts
+++ b/packages/web-components/src/components/content-block-horizontal/content-block-horizontal.ts
@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020, 2021
+ * Copyright IBM Corp. 2020, 2022
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -22,8 +22,8 @@ const { stablePrefix: ddsPrefix } = ddsSettings;
  */
 @customElement(`${ddsPrefix}-content-block-horizontal`)
 class DDSContentBlockHorizontal extends DDSContentGroup {
-  @property({ type: Boolean, reflect: true })
-  border: Boolean = true;
+  @property({ type: Boolean, reflect: true, attribute: 'border' })
+  border = false;
 
   render() {
     return html`
diff --git a/packages/web-components/tests/snapshots/dds-content-block-horizontal.md b/packages/web-components/tests/snapshots/dds-content-block-horizontal.md
index 42f52f12bfb..31b1e6f1045 100644
--- a/packages/web-components/tests/snapshots/dds-content-block-horizontal.md
+++ b/packages/web-components/tests/snapshots/dds-content-block-horizontal.md
@@ -26,8 +26,6 @@
   <slot name="complementary">
   </slot>
 </div>
-<dds-hr data-autoid="dds--hr">
-</dds-hr>
 
 ```
 
@@ -55,8 +53,6 @@
   <slot name="complementary">
   </slot>
 </div>
-<dds-hr data-autoid="dds--hr">
-</dds-hr>
 
 ```