[#431] [CLEANUP] Extraction des images SVG dans le code (part 2). (#431)

* Extract challenge-stay SVG image

* Extract qroc-solution-panel SVG arrow image

* Remove useless component template components/get-result

* Extract qrocm-ind-solution-panel SVG arrow file

* Make test helper config be like a new project's one

live/app/styles/components/_qroc-solution-panel.scss

@@ -44,3 +44,8 @@
   position: relative;
   bottom: 3px;
 }
+
+.correction-qroc-box__solution-img {
+  width:18px;
+  height:18px;
+}

live/app/styles/components/_qrocm-solution-panel.scss

@@ -29,6 +29,11 @@
   margin-top: 4px;
 }
 
+.correction-qrocm__solution-img {
+  width:18px;
+  height:18px;
+}
+
 .correction-qrocm__solution-text {
   font-family: $font-lato;
   font-weight: $font-bold;

live/app/templates/components/challenge-stay.hbs

@@ -1,6 +1,6 @@
 <div class='challenge-stay__container'>
   <div class='challenge-stay__icon'>
-    <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='24' height='24' viewBox='0 0 24 24'><path d='M9,22A1,1 0 0,1 8,21V18H4A2,2 0 0,1 2,16V4C2,2.89 2.9,2 4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H13.9L10.2,21.71C10,21.9 9.75,22 9.5,22V22H9M13,10V6H11V10H13M13,14V12H11V14H13Z' /></svg>
+    <img class="challenge-stay__icon-img" src="/images/icon-warning.svg" alt="Avertissement sur les conditions de réalisation de l'épreuve">
   </div>
   <div class='challenge-stay__text'>Vous devez répondre à cette question sans sortir de cette page !</div>
 </div>

live/app/templates/components/medal-item.hbs

@@ -1,5 +1,6 @@
-<div class="medal-item__div"><img src="{{rootURL}}/images/medaille.svg" alt="Médaille obtenue"
-                                           class="medal-item__medal-img"></div>
+<div class="medal-item__div">
+  <img src="{{rootURL}}/images/medaille.svg" alt="Médaille obtenue" class="medal-item__medal-img">
+</div>
 <div class="medal-item__pix-score">+{{pixScore}}</div>
 <div class="medal-item__pix-text">pix</div>
 <div class="medal-item__bêta">BÊTA</div>

live/app/templates/components/qroc-solution-panel.hbs

@@ -2,19 +2,15 @@
   <div class="rounded-panel__row ">
 
     <div class="correction-qroc-box__answer">
-      <input class="{{inputClass}} correction-qroc-box--answer__input"
-             value="{{answerToDisplay}}"
-             disabled>
+      <input class="{{inputClass}} correction-qroc-box--answer__input" value="{{answerToDisplay}}" disabled>
     </div>
 
     {{#unless isResultOk}}
       <div class="correction-qroc-box__solution">
-        <svg style="width:18px;height:18px" viewBox="0 0 24 24"><path fill="#12caa1" d="M5,21A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H19A2,2 0 0,1 21,5V19C21,20.11 20.1,21 19,21H5M6,13H14.5L11,16.5L12.42,17.92L18.34,12L12.42,6.08L11,7.5L14.5,11H6V13Z"/></svg>
+        <img class="correction-qroc-box__solution-img" src="/images/comparison-window/icon-arrow-right.svg" alt="">
         <div class="correction-qroc-box__solution-text">{{solutionToDisplay}}</div>
       </div>
     {{/unless}}
-
-
   </div>
 </div>
 

live/app/templates/components/qrocm-ind-solution-panel.hbs

@@ -16,14 +16,8 @@
 
             {{#if field.emptyOrWrongAnswer}}
               <div class="correction-qrocm__solution">
-                <svg style="width:18px;height:18px" viewBox="0 0 24 24">
-                  <path fill="#12caa1"
-                        d="M5,21A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H19A2,2 0 0,1 21,5V19C21,20.11 20.1,21 19,21H5M6,13H14.5L11,16.5L12.42,17.92L18.34,12L12.42,6.08L11,7.5L14.5,11H6V13Z"/>
-                </svg>
-
-                <div class="correction-qrocm__solution-text">
-                  {{field.solution}}
-                </div>
+                <img class="correction-qrocm__solution-img" src="/images/comparison-window/icon-arrow-right.svg" alt="">
+                <div class="correction-qrocm__solution-text">{{field.solution}}</div>
               </div>
             {{/if}}
           </div>

live/tests/helpers/destroy-app.js

@@ -2,5 +2,7 @@ import Ember from 'ember';
 
 export default function destroyApp(application) {
   Ember.run(application, 'destroy');
-  server.shutdown();
+  if (window.server) {
+    window.server.shutdown();
+  }
 }

live/tests/helpers/module-for-acceptance.js

@@ -0,0 +1,23 @@
+import { module } from 'qunit';
+import Ember from 'ember';
+import startApp from '../helpers/start-app';
+import destroyApp from '../helpers/destroy-app';
+
+const { RSVP: { Promise } } = Ember;
+
+export default function(name, options = {}) {
+  module(name, {
+    beforeEach() {
+      this.application = startApp();
+
+      if (options.beforeEach) {
+        return options.beforeEach.apply(this, arguments);
+      }
+    },
+
+    afterEach() {
+      const afterEach = options.afterEach && options.afterEach.apply(this, arguments);
+      return Promise.resolve(afterEach).then(() => destroyApp(this.application));
+    }
+  });
+}

live/tests/integration/components/challenge-stay-test.js

@@ -14,4 +14,14 @@ describe('Integration | Component | challenge stay', function() {
     expect(this.$()).to.have.length(1);
   });
 
+  it('should display a warning icon with an accessible description', function() {
+    // when
+    this.render(hbs`{{challenge-stay}}`);
+
+    // then
+    const $img = this.$('.challenge-stay__icon-img');
+    expect($img).to.have.lengthOf(1);
+    expect($img.attr('src')).to.equal('/images/icon-warning.svg');
+    expect($img.attr('alt')).to.not.be.empty;
+  });
 });