// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`MultipleChoice snapshot test 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      Sample Stem
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;InCorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with 2 images using markdown text format 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title with Image&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      &lt;img alt="Sample Image" src="https://via.placeholder.com/150"&gt;
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1

            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2

            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Incorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            &lt;img alt="Sample Image" src="https://via.placeholder.com/150"&gt;
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Image Feedback&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback with Image
&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with Moodle text format 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      Sample Stem
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;InCorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with image 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title with Image&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      Sample Stem with Image
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Incorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            &lt;img alt="Sample Image" src="https://via.placeholder.com/150"&gt;
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Image Feedback&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback with Image&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with image using markdown text format 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title with Image&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      Sample Stem with Image

                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1

            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2

            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Incorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            &lt;img alt="Sample Image" src="https://via.placeholder.com/150"&gt;
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Image Feedback&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback with Image
&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with katex 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      &lt;span class="katex-display"&gt;&lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;&lt;math display="block" xmlns="http://www.w3.org/1998/Math/MathML"&gt;&lt;mrow&gt;&lt;mfrac&gt;&lt;mrow&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;/mrow&gt;&lt;mrow&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;/mrow&gt;&lt;/mfrac&gt;&lt;/mrow&gt;\\frac{zzz}{yyy}&lt;/math&gt;&lt;/span&gt;&lt;span aria-hidden="true" class="katex-html"&gt;&lt;span class="base"&gt;&lt;span style="height:1.988em;vertical-align:-0.8804em;" class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mopen nulldelimiter"&gt;&lt;/span&gt;&lt;span class="mfrac"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span style="height:1.1076em;" class="vlist"&gt;&lt;span style="top:-2.314em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span style="margin-right:0.03588em;" class="mord mathnormal"&gt;yyy&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="top:-3.23em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span style="border-bottom-width:0.04em;" class="frac-line"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="top:-3.677em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span style="margin-right:0.04398em;" class="mord mathnormal"&gt;zzz&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span style="height:0.8804em;" class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose nulldelimiter"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;

exports[`MultipleChoice snapshot test with katex, using html text format 1`] = `
<DocumentFragment>
  &lt;section style="
  flex-wrap: wrap;
  position: relative;
  padding: 1rem 1rem;
  margin-bottom: 0.5rem;
  background-color: hsl(0, 0%, 100%);
  border: solid hsl(0, 0%, 100%) 2px;
  border-radius: 6px;
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
"&gt;
  &lt;div style="
  display: flex;
  font-weight: bold;
"&gt;
    &lt;span&gt;
      &lt;span style="
  color: #5271FF;
  "&gt;Sample Title&lt;/span&gt;
    &lt;/span&gt;
    &lt;span style="
  margin-left: auto;
  padding-left: 0.75rem;
  flex: none;
 margin-bottom: 10px;"&gt;
      &lt;span style="
  box-shadow: 0px 1px 3px hsl(0, 0%, 74%);
  padding-left: 0.7rem;
  padding-right: 0.7rem;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  border-radius: 4px;
  background-color: hsl(0, 0%, 100%);
  color: hsl(180, 15%, 41%);
"&gt;Choix multiple&lt;/span&gt;
    &lt;/span&gt;
  &lt;/div&gt;

  &lt;div style="
  display: flex;
"&gt;
    &lt;span&gt;
      &lt;p style="
  color: hsl(0, 0%, 0%);
" class="present-question-stem"&gt;
                      &lt;span class="katex-display"&gt;&lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;&lt;math display="block" xmlns="http://www.w3.org/1998/Math/MathML"&gt;&lt;mrow&gt;&lt;mfrac&gt;&lt;mrow&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;mi&gt;z&lt;/mi&gt;&lt;/mrow&gt;&lt;mrow&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;mi&gt;y&lt;/mi&gt;&lt;/mrow&gt;&lt;/mfrac&gt;&lt;/mrow&gt;\\frac{zzz}{yyy}&lt;/math&gt;&lt;/span&gt;&lt;span aria-hidden="true" class="katex-html"&gt;&lt;span class="base"&gt;&lt;span style="height:1.988em;vertical-align:-0.8804em;" class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mopen nulldelimiter"&gt;&lt;/span&gt;&lt;span class="mfrac"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span style="height:1.1076em;" class="vlist"&gt;&lt;span style="top:-2.314em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span style="margin-right:0.03588em;" class="mord mathnormal"&gt;yyy&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="top:-3.23em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span style="border-bottom-width:0.04em;" class="frac-line"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="top:-3.677em;"&gt;&lt;span style="height:3em;" class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span style="margin-right:0.04398em;" class="mord mathnormal"&gt;zzz&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span style="height:0.8804em;" class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose nulldelimiter"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
                  &lt;/p&gt;
    &lt;/span&gt;
  &lt;/div&gt;
&lt;span style="
  color: hsl(0, 0%, 0%);
"&gt;Choisir une réponse:&lt;/span&gt;
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 1
            &lt;/label&gt;
          &lt;svg data-testid="correct-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 1em;
    color: hsl(120, 39%, 54%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"&gt;&lt;path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;Correct!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        
        &lt;div class='multiple-choice-answers-container'&gt;
          &lt;input class="gift-input" type="radio" id="idmocked-id" name="idmocked-id"&gt;
          &lt;span class="answer-weight-container answer-positive-weight"&gt;1%&lt;/span&gt;
            &lt;label style="
          display: inline-block;
          padding: 0.2em 0 0.2em 0;
         
  color: hsl(0, 0%, 0%);
" for="idmocked-id"&gt;
            Choice 2
            &lt;/label&gt;
          &lt;svg data-testid="incorrect-icon" style="
  vertical-align: text-bottom;
  display: inline-block;
  margin-left: 0.1rem;
  margin-right: 0.2rem;
 
    width: 0.75em;
    color: hsl(2, 64%, 58%);
  " role="img" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"&gt;&lt;path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"&gt;&lt;/path&gt;&lt;/svg&gt;
          &lt;span class="feedback-container"&gt;InCorrect!&lt;/span&gt;
          &lt;/input&gt;
        &lt;/div&gt;
        &lt;div style="
  position: relative;
  margin-top: 1rem;
  padding: 0 1rem;
  background-color: hsl(43, 100%, 94%);
  color: hsl(43, 95%, 9%);
  border: hsl(36, 84%, 93%) 1px solid;
  border-radius: 6px;
  box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
"&gt;
        &lt;p&gt;Sample Global Feedback&lt;/p&gt;
      &lt;/div&gt;&lt;/section&gt;
</DocumentFragment>
`;
