chore(eslint): add unicorn/prefer-add-event-listener rule

.eslintrc.cjs

@@ -42,6 +42,7 @@ module.exports = {
     ],
     'unicorn/prevent-abbreviations': 'error',
     'unicorn/prefer-query-selector': 'error',
+    'unicorn/prefer-add-event-listener': 'error',
     'import/newline-after-import': ['error', { count: 1 }],
     'import/first': 'error',
     'import/order': [

dev/ts/component/download.ts

@@ -66,21 +66,21 @@ export function downloadAsPng(svg: string): void {
   const canvas = document.createElement('canvas');
   const canvasContext = canvas.getContext('2d');
 
-  imgPreview.onload = function () {
+  imgPreview.addEventListener('load', function () {
     const img = new Image();
     // B.2.0 not fully exported with client width/height, so use natural width/height
     canvas.width = imgPreview.naturalWidth;
     canvas.height = imgPreview.naturalHeight;
     img.crossOrigin = 'Anonymous';
-    img.onload = function () {
+    img.addEventListener('load', function () {
       canvasContext.drawImage(img, 0, 0);
       URL.revokeObjectURL(svgUrl);
       const pngInBase64 = canvas.toDataURL('image/png');
       document.body.removeChild(imgPreview);
       download('diagram.png', '', pngInBase64);
       logDownload('Download completed');
-    };
+    });
     img.src = imgPreview.src;
-  };
+  });
   imgPreview.src = svgUrl;
 }

dev/ts/pages/elements-identification.ts

@@ -200,7 +200,7 @@ function resetTextArea(): void {
 
 function configureControls(): void {
   const selectedKindElt = document.querySelector('#bpmn-kinds-select') as HTMLSelectElement;
-  selectedKindElt.onchange = event => updateSelectedBPMNElements((event.target as HTMLSelectElement).value as ShapeBpmnElementKind);
+  selectedKindElt.addEventListener('change', event => updateSelectedBPMNElements((event.target as HTMLSelectElement).value as ShapeBpmnElementKind));
   document.addEventListener('diagramLoaded', () => updateSelectedBPMNElements(selectedKindElt.value as ShapeBpmnElementKind), false);
 
   document.querySelector('#clear-btn').addEventListener('click', function () {

dev/ts/shared/main.ts

@@ -167,9 +167,9 @@ function collapseBpmnElement(bpmnElementId: string): void {
 // callback function for opening | dropping the file to be loaded
 function readAndLoadFile(f: File): void {
   const reader = new FileReader();
-  reader.onload = () => {
+  reader.addEventListener('load', () => {
     loadBpmn(reader.result as string);
-  };
+  });
   reader.readAsText(f);
 }