improve: error indicator

electron/electron.ts

@@ -4,8 +4,10 @@ import * as path from "path";
 import * as fs from "fs";
 import * as Stream from "stream";
 import { ffprobe as ffprobePath } from "./ffmpeg";
-import { execSync } from "child_process";
+import {spawn} from "./lib/spawn";
 import { typeGuard } from "./typeGuard";
+import {execSync} from "child_process";
+
 
 let mainWindow, renderWindow;
 const createWindow = () => {
@@ -218,21 +220,34 @@ const selectMovie = async(IpcMainEvent) => {
   if (path.canceled) {
     return;
   }
-  let ffprobe
+  let ffprobe:spawnResult
+  let metadata;
   try {
-    ffprobe = execSync(
-      `${ffprobePath} "${path.filePaths[0].replace(/"/g,"\\\"")}" -hide_banner -v quiet -print_format json -show_streams`
-    );
+    ffprobe = await spawn(ffprobePath,[path.filePaths[0],"-hide_banner", "-v", "quiet", "-print_format", "json", "-show_streams"]);
   }catch (e) {
     IpcMainEvent.reply("response", {
       type: "selectMovie",
       target: "main",
-      message: "input file is not movie(ffprobe fail)",
+      message: `
+<div>input file is not movie(fail to execute ffprobe)</div>
+<div>code:<pre><code>${e.code}</code></pre></div>
+<div>stdout:<pre><code>${e.stdout}</code></pre></div>
+<div>stdout:<pre><code>${e.stderr}</code></pre></div>`,
+    });
+    return;
+  }
+  try{
+    metadata = JSON.parse(ffprobe.stdout);
+  }catch (e){
+    IpcMainEvent.reply("response", {
+      type: "selectMovie",
+      target: "main",
+      message: `
+<div>input file is not movie(fail to parse ffprobe output)</div>
+<div>Error:<pre><code>${JSON.stringify(e)}</code></pre></div>`,
     });
     return;
   }
-  let metadata;
-  metadata = JSON.parse(ffprobe.toString());
   if (!metadata.streams||!Array.isArray(metadata.streams)) {
     IpcMainEvent.reply("response", {
       type: "selectMovie",
@@ -285,8 +300,7 @@ const selectComment = async(IpcMainEvent) => {
   const file = path.filePaths[0];
   const fileData = fs.readFileSync(file, "utf8");
   if (file.match(/\.xml$/)){
-    const parser = new DOMParser();
-    data = parser.parseFromString(fileData, "application/xml");
+    data = fileData;
     type = "niconicome";
   }else if(file.match(/\.txt$/)){
     data = fileData;

electron/lib/spawn.ts

@@ -0,0 +1,27 @@
+import * as child_process from "child_process";
+
+function spawn (cmd:string,args?: string[],options?: child_process.SpawnOptionsWithoutStdio):Promise<spawnResult>{
+  return new Promise<spawnResult>((resolve,reject)=>{
+    let stdout = "",stderr = "";
+    let p = child_process.spawn(cmd,args,options);
+    p.on('exit', (code)=>{
+      if (code === 0){
+        resolve({
+          stderr,stdout,code
+        });
+      }else{
+        reject({
+          stderr,stdout,code
+        });
+      }
+    });
+    p.stdout.setEncoding('utf-8');
+    p.stdout.on('data', (data)=>{
+      stdout+=data;
+    });
+    p.stderr.on('data', (data)=>{
+      stderr+=data;
+    });
+  })
+}
+export {spawn};

package.json

@@ -25,6 +25,7 @@
     "cross-env": "^7.0.3",
     "electron": "^20.1.0",
     "electron-builder": "^23.3.3",
+    "jsdom": "^20.0.2",
     "prettier": "^2.7.1",
     "rimraf": "^3.0.2",
     "typescript": "^4.6.4",

src/@types/types.d.ts

@@ -115,4 +115,5 @@ type options = {
   showCommentCount: boolean;
   keepCA: boolean;
   scale: number;
-};
+};
+type spawnResult = {stdout: string, stderr: string, code: number}

src/main.ts

@@ -3,6 +3,7 @@ import {str2time, time2str} from "./timeUtil";
 
 const init = () => {
   document.body.innerHTML = `
+<div id="info"></div>
 <div id="movieInput">
   <button id="movie">動画を選択</button>
   <p id="movieMessage"></p>
@@ -106,7 +107,8 @@ const init = () => {
     progressWrapper = document.getElementById("progress"),
     genProgress = document.getElementById("genProgress"),
     conProgress = document.getElementById("conProgress"),
-    options = document.getElementById("options");
+    options = document.getElementById("options"),
+    info = document.getElementById("info");
 
   if (
     !(
@@ -124,7 +126,8 @@ const init = () => {
       progressWrapper &&
       genProgress &&
       conProgress &&
-      options
+      options &&
+      info
     )
   )
     throw new Error();
@@ -188,7 +191,7 @@ const init = () => {
     if (data.target !== "main") return;
     if (typeGuard.main.selectMovie(data)) {
       if (data.message){
-        movieMessage.innerText = data.message;
+        movieMessage.innerHTML = data.message;
         return;
       }
       const {path,width,height,duration} = data.data;
@@ -224,7 +227,7 @@ const init = () => {
       clipStartInput.value=clipEndInput.value="";
       alert("変換が完了しました");
     } else if(typeGuard.main.message(data)){
-      alert(data.message);
+      info.innerHTML = data.message
     }
   });
   const progress = (element: HTMLElement, current: number, max: number) => {

src/render.ts

@@ -30,6 +30,10 @@ const init = () => {
     if (data.target !== "render") return;
     if (typeGuard.render.start(data)) {
       inProgress = true;
+      if (data.format==="niconicome"){
+        const parser = new DOMParser();
+        data.data = parser.parseFromString(data.data as string, "application/xml");
+      }
       const canvas = document.getElementById("canvas") as HTMLCanvasElement;
       // @ts-ignore
       const nico = new NiconiComments(canvas, data.data, {