3 files changed, 238 insertions, 0 deletions
diff --git a/files/fr/web/api/customevent/detail/index.html b/files/fr/web/api/customevent/detail/index.html
new file mode 100644
index 0000000000..0890ad04bb
--- /dev/null
+++ b/files/fr/web/api/customevent/detail/index.html
@@ -0,0 +1,73 @@
+---
+title: CustomEvent.detail
+slug: Web/API/CustomEvent/detail
+tags:
+  - API
+  - DOM
+  - Propriétés
+  - Évènement personnalisé
+translation_of: Web/API/CustomEvent/detail
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>Le <code><strong>detail</strong></code> de la propriété en lecture seule de l'interface {{domxref("CustomEvent")}} renvoie toutes les données transmises lors de l'initialisation de l'évènement.</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Syntaxe">Syntaxe</h2>
+
+<pre class="syntaxbox"> let myDetail = <em>customEventInstance.detail</em>;</pre>
+
+<h3 id="Valeur_retournée">Valeur retournée</h3>
+
+<p>Toute donnée initialisée avec l'évènement.</p>
+
+<h2 id="Exemple">Exemple</h2>
+
+<pre class="brush: js">// ajoute un écouteur d'évènement approprié
+obj.addEventListener("cat", function(e) { process(e.detail) });
+
+// crée et distribue l'évènement
+let event = new CustomEvent("cat", {
+  detail: {
+    hazcheeseburger: true
+  }
+});
+obj.dispatchEvent(event);
+
+// Retournera un objet contenant la propriété hazcheeseburger
+let myDetail = <em>event.detail</em>;
+</pre>
+
+<h2 id="Spécifications">Spécifications</h2>
+
+<table class="standard-table" style="height: 49px; width: 1000px;">
+ <thead>
+  <tr>
+   <th scope="col">Spécification</th>
+   <th scope="col">Statut</th>
+   <th scope="col">Commentaire</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#dom-customeventinit-detail','detail')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Définition initiale.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+
+
+
+<p>{{Compat("api.CustomEvent.detail")}}</p>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li>{{domxref("CustomEvent")}}</li>
+</ul>
+
+<p> </p>
diff --git a/files/fr/web/api/customevent/index.html b/files/fr/web/api/customevent/index.html
new file mode 100644
index 0000000000..d49584c1fb
--- /dev/null
+++ b/files/fr/web/api/customevent/index.html
@@ -0,0 +1,95 @@
+---
+title: CustomEvent
+slug: Web/API/CustomEvent
+tags:
+  - API
+  - DOM
+  - Interface
+  - Reference
+  - évènements
+translation_of: Web/API/CustomEvent
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>Les interfaces <code>CustomEvent</code> DOM sont des évènements initialisés par une application pour n'importe quel usage.</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Method_overview" name="Method_overview">Constructeur</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}</dt>
+ <dd>Crée un <code>CustomEvent.</code></dd>
+</dl>
+
+<h2 id="Attributes" name="Attributes">Propriétés</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.detail")}} {{readonlyinline}}</dt>
+ <dd><span id="result_box" lang="fr"><span>Toute donnée transmise lors de l'initialisation de l'événement.</span></span></dd>
+</dl>
+
+<p>Cette interface hérite des propriétés de son parent {{domxref("Event")}}:</p>
+
+<p>{{Page("/fr/docs/Web/API/Event", "Propriétés")}}</p>
+
+<h2 id="Méthodes">Méthodes</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.initCustomEvent()")}} {{deprecated_inline}}</dt>
+ <dd><span id="result_box" lang="fr"><span>Initialise un objet CustomEvent.</span> <span>Si l'événement a déjà été distribué, cette méthode ne fait rien.</span></span></dd>
+</dl>
+
+<p>Cette interface hérite les méthodes de son parent {{domxref("Event")}}:</p>
+
+<p>{{Page("/fr/docs/Web/API/Event", "Méthodes")}}</p>
+
+<h2 id="Spécifications">Spécifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Spécification</th>
+   <th scope="col">Statut</th>
+   <th scope="col">Commentaire</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#interface-customevent','CustomEvent')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Définition initial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2>
+
+
+
+<p>{{Compat("api.CustomEvent")}}</p>
+
+<div id="compat-desktop">
+<h2 id="Déclenchement_à_partir_de_code_privilégié_vers_du_code_non-privilégié">Déclenchement à partir de code privilégié vers du code non-privilégié</h2>
+</div>
+
+<p>Lors du déclenchement d'un CustomEvent depuis du code privilégié (une extension, par exemple) vers du code non-privilégié (une page web par exemple), vous devez prendre en considération la sécurité. Firefox et les autres applications Gecko empêchent qu'un objet créé dans un contexte soit utilisé dans un autre, ce qui empêchera généralement les failles de sécurité, mais ces restrictions peuvent aussi empêcher votre code de s'executer comme prévu.</p>
+
+<p>Lors de la création d'un objet CustomEvent, vous devez créer l'objet à partir de la même <a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/window">fenêtre</a> que celle où vous déclencherez l'évenement.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="comment token">// doc est une référence au contenu du document</span>
+<span class="keyword token">function</span> <span class="function token">dispatchCustomEvent</span><span class="punctuation token">(</span>doc<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> eventDetail <span class="operator token">=</span> Components<span class="punctuation token">.</span>utils<span class="punctuation token">.</span><span class="function token">cloneInto</span><span class="punctuation token">(</span><span class="punctuation token">{</span>foo<span class="punctuation token">:</span> <span class="string token">'bar'</span><span class="punctuation token">}</span><span class="punctuation token">,</span> doc<span class="punctuation token">.</span>defaultView<span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="keyword token">var</span> myEvent <span class="operator token">=</span> doc<span class="punctuation token">.</span>defaultView<span class="punctuation token">.</span><span class="function token">CustomEvent</span><span class="punctuation token">(</span><span class="string token">"mytype"</span><span class="punctuation token">,</span> eventDetail<span class="punctuation token">)</span><span class="punctuation token">;</span>
+  doc<span class="punctuation token">.</span><span class="function token">dispatchEvent</span><span class="punctuation token">(</span>myEvent<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>Notez qu'exposer une fonction permettra au script de l'exécuter avec les privilèges qu'accorde Chrome ce qui peut ouvrir une faille de sécurité.</p>
+
+<h2 id="Specification" name="Specification">Voir aussi</h2>
+
+<ul>
+ <li><a href="/fr/docs/Extraits_de_code/Interaction_entre_des_pages_%C3%A0_privil%C3%A8ges_et_sans_privil%C3%A8ges" title="/fr/docs/Extraits_de_code/Interaction_entre_des_pages_%C3%A0_privil%C3%A8ges_et_sans_privil%C3%A8ges">Interaction entre pages privilégiées et non-privilégiées</a></li>
+ <li><a href="https://developer.mozilla.org/fr/docs/Web/API/Window/postMessage" title="/en-US/docs/Web/API/window.postMessage">Window.postMessage</a></li>
+ <li><a href="https://developer.mozilla.org/fr/docs/Web/Guide/DOM/Events/Creating_and_triggering_events">Création et déclenchement d'événements</a></li>
+</ul>
diff --git a/files/fr/web/api/customevent/initcustomevent/index.html b/files/fr/web/api/customevent/initcustomevent/index.html
new file mode 100644
index 0000000000..4a1896eb5f
--- /dev/null
+++ b/files/fr/web/api/customevent/initcustomevent/index.html
@@ -0,0 +1,70 @@
+---
+title: CustomEvent.initCustomEvent()
+slug: Web/API/CustomEvent/initCustomEvent
+tags:
+  - API
+  - DOM
+  - Méthodes
+translation_of: Web/API/CustomEvent/initCustomEvent
+---
+<p>{{APIRef("DOM")}}{{deprecated_header}}</p>
+
+<p>La méthode <code><strong>CustomEvent.initCustomEvent()</strong></code> initialise un objet <code>CustomEvent</code>. Si l'évènement a déjà été distribué, cette méthode ne change rien.</p>
+
+<p>Les évènements initialisés par ce moyen doivent être créés avec la méthode {{domxref("Document.createEvent()")}}. Cette méthode doit être appelée pour définir l'évènement avant son envoi en utilisant {{domxref("EventTarget.dispatchEvent()") }}. Une fois l'évènement envoyé, la méthode ne fait rien.</p>
+
+<div class="note">
+<p><strong>N'utilisez plus cette méthode car elle est dépréciée.</strong></p>
+
+<p>À la place, utilisez les constructeurs d'évènements spécifiques comme {{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}. La page <a href="https://developer.mozilla.org/fr/docs/Web/Guide/DOM/Events/Creating_and_triggering_events">Création et déclenchement d'évènements</a> donne plus d'informations sur la façon de les utiliser.</p>
+</div>
+
+<h2 id="Syntaxe">Syntaxe</h2>
+
+<pre class="syntaxbox"><em>event</em>.initCustomEvent(<em>type</em>, <em>canBubble</em>, <em>cancelable</em>, <em>detail</em>);
+</pre>
+
+<h3 id="Paramètres">Paramètres</h3>
+
+<dl>
+ <dt><code><em>type</em></code></dt>
+ <dd>est une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant le nom de l'évènement.</dd>
+ <dt><em><code>canBubble</code></em></dt>
+ <dd>est un {{jsxref("Boolean")}} (<em>booléen</em>) indiquant si l'événement passe à travers le DOM ou non.</dd>
+ <dt><code><em>cancelable</em></code></dt>
+ <dd>est un {{jsxref("Boolean")}} indiquant si l'événement est annulable.</dd>
+ <dt><em><code>deta</code></em><em><code>il</code></em></dt>
+ <dd>Les données transmises lors de l'initialisation de l'évènement.</dd>
+</dl>
+
+<h2 id="Spécifications">Spécifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Spécification</th>
+   <th scope="col">Statut</th>
+   <th scope="col">Commentaire</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#dom-customevent-initcustomevent','CustomEvent')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Définition initiale, mais déjà dépréciée au profit de l'utilisation d'un constructeur,{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+
+
+
+<p>{{Compat("api.CustomEvent.initCustomEvent")}}</p>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li>{{domxref("CustomEvent")}}</li>
+ <li>Le constructeur à utiliser à la place de cette méthode obsolète : {{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}.</li>
+</ul>