# A collapsible section with markdown
<details>
  <summary>Click to expand!</summary>
  
  ## Heading
  1. A numbered
  2. list
     * With some
     * Sub bullets
</details>

# A collapsible section with code
<details>
  <summary>Click to expand!</summary>
  
  ```javascript
    function whatIsLove() {
      console.log('Baby Don't hurt me. Don't hurt me');
      return 'No more';
    }
  ```
</details>

# How to structure the markup
```
# A collapsible section with markdown
<details>
  <summary>Click to expand!</summary>
  
  ## Heading
  1. A numbered
  2. list
     * With some
     * Sub bullets
</details>
```
**NB:** Make sure you have an **empty line** after the closing `</summary>` tag.

**NB**: Make sure you have an **empty line** after the closing `</details>` tag if you have multiple collapsible sections.

# Make collapsible section default opened

> **Note:** <br>
> all the UIKit's accessibilityIdentifier is a preperty of the protocol `UIAccessibilityIdentification` and all enum's rawValue is default to follow `RawRepresentable`
><blockquote>

<details open><summary> Expand for steps details </summary>
<br>
	
- 1.1 Define the enums
	- set rawValue in String
	- append PrettyRawRepresentable if need
- 1.2 set UIKit's accessibilityIdentifier by enums's rawValue
	- method1: infix operator
	- method2: UIAccessibilityIdentification's extension
- 1.3 Apply in UITest target
</details></blockquote>