Merge branch 'feature/dome/code-mirror-ts' into 'master'

[dome] porting text components to TS

Closes #921 and #830

See merge request frama-c/frama-c!2763

ivette/.eslintrc.js

@@ -77,5 +77,9 @@ module.exports = {
     "react/destructuring-assignment": "off",
     // Allow console errors and warnings
     "no-console": ["error", { allow: ["warn", "error"] }],
+    // Disallow the use of var in favor of let and const
+    "no-var": "error",
+    // Do not favor default import
+    "import/prefer-default-export": "off",
   }
 };

ivette/package.json

@@ -21,7 +21,7 @@
     "@babel/preset-react": "^7.9.4",
     "@babel/preset-typescript": "^7.9.0",
     "@hot-loader/react-dom": "^16.13.0",
-    "@types/codemirror": "^0.0.89",
+    "@types/codemirror": "^0.0.97",
     "@types/cytoscape": "^3.14.5",
     "@types/lodash": "^4.14.149",
     "@types/node": "12.12.21",

ivette/src/frama-c/server.ts

@@ -478,7 +478,7 @@ async function _launch() {
   const logger = (text: string | string[]) => {
     buffer.append(text);
     if (text.indexOf('\n') >= 0) {
-      buffer.scroll(undefined, undefined);
+      buffer.scroll();
     }
   };
   process?.stdout?.on('data', logger);

ivette/src/frama-c/utils.ts

+// --------------------------------------------------------------------------
+// --- Frama-C Utilities
+// --------------------------------------------------------------------------
+
+/**
+ * @packageDocumentation
+ * @module frama-c/utils
+*/
+
+import * as Dome from 'dome';
+import * as DomeBuffers from 'dome/text/buffers';
+import * as KernelData from 'api/kernel/data';
+
+const PP = new Dome.PP('Utils');
+
+// --------------------------------------------------------------------------
+// --- Print Utilities
+// --------------------------------------------------------------------------
+
+/**
+ * Print text containing tags into buffer.
+ * @param buffer Rich text buffer to print into.
+ * @param contents Actual text containing tags.
+ * @param options Specify particular marker options.
+ */
+export function printTextWithTags(
+  buffer: DomeBuffers.RichTextBuffer,
+  contents: KernelData.text,
+  options?: DomeBuffers.MarkerProps,
+) {
+  if (Array.isArray(contents)) {
+    let marker = false;
+    const tag = contents.shift();
+    if (tag) {
+      if (Array.isArray(tag)) {
+        contents.unshift(tag);
+      } else {
+        buffer.openTextMarker({ id: tag, ...options ?? {} });
+        marker = true;
+      }
+    }
+    contents.forEach((txt) => printTextWithTags(buffer, txt, options));
+    if (marker) {
+      marker = false;
+      buffer.closeTextMarker();
+    }
+  } else if (typeof contents === 'string') {
+    buffer.append(contents);
+  } else {
+    PP.error('Unexpected text', contents);
+  }
+}

ivette/src/renderer/ASTinfo.tsx

@@ -4,6 +4,7 @@
 
 import React from 'react';
 import * as States from 'frama-c/states';
+import * as Utils from 'frama-c/utils';
 
 import { Vfill } from 'dome/layout/boxes';
 import { RichTextBuffer } from 'dome/text/buffers';
@@ -25,7 +26,9 @@ const ASTinfo = () => {
 
   React.useEffect(() => {
     buffer.clear();
-    buffer.printTextWithTags(data, { css: 'color: blue' });
+    if (data) {
+      Utils.printTextWithTags(buffer, data, { css: 'color: blue' });
+    }
   }, [buffer, data]);
 
   // Callbacks

ivette/src/renderer/ASTview.tsx

@@ -6,14 +6,13 @@ import React from 'react';
 import _ from 'lodash';
 import * as Server from 'frama-c/server';
 import * as States from 'frama-c/states';
+import * as Utils from 'frama-c/utils';
 
 import * as Dome from 'dome';
-import { key } from 'dome/data/json';
 import { RichTextBuffer } from 'dome/text/buffers';
 import { Text } from 'dome/text/editors';
 import { IconButton } from 'dome/controls/buttons';
 import { Component, TitleBar } from 'frama-c/LabViews';
-
 import { printFunction, markerInfo } from 'api/kernel/ast';
 import { getCallers, getDeadCode } from 'api/plugins/eva/general';
 
@@ -47,19 +46,16 @@ async function loadAST(
     (async () => {
       try {
         const data = await Server.send(printFunction, theFunction);
-        buffer.operation(() => {
-          buffer.clear();
-          if (!data) {
-            buffer.log('// No code for function', theFunction);
-          }
-          buffer.printTextWithTags(data);
-          if (theMarker)
-            buffer.scroll(theMarker, undefined);
-        });
+        buffer.clear();
+        if (!data) {
+          buffer.log('// No code for function', theFunction);
+        }
+        Utils.printTextWithTags(buffer, data);
+        if (theMarker)
+          buffer.scroll(theMarker);
       } catch (err) {
         PP.error(
-          `Fail to retrieve the AST of function '${theFunction}' ` +
-          `and marker '${theMarker}':`, err,
+          'Fail to obtain AST', theFunction, theMarker, err,
         );
       }
     })();
@@ -122,21 +118,21 @@ const ASTview = () => {
 
   // Hook: marker scrolling
   React.useEffect(() => {
-    if (theMarker) buffer.scroll(theMarker, undefined);
+    if (theMarker) buffer.scroll(theMarker);
   }, [buffer, theMarker]);
 
   // Callbacks
   const zoomIn = () => fontSize < 48 && setFontSize(fontSize + 2);
   const zoomOut = () => fontSize > 4 && setFontSize(fontSize - 2);
 
-  function onTextSelection(id: key<'#markerInfo'>) {
+  function onTextSelection(id: string) {
     if (selection.current) {
       const location = { ...selection.current, marker: id };
       updateSelection({ location });
     }
   }
 
-  async function onContextMenu(id: key<'#markerInfo'>) {
+  async function onContextMenu(id: string) {
     const items = [];
     const selectedMarkerInfo = markersInfo.find((e) => e.key === id);
     if (selectedMarkerInfo?.var === 'function') {

ivette/tsconfig.json

@@ -48,7 +48,8 @@
       "dome": [ "src/dome/src/renderer/dome.js" ],
       "dome/system": [ "src/dome/src/misc/system.js" ],
       "dome/misc/*": [ "src/dome/src/misc/*"],
-      "dome/*": [ "src/dome/src/renderer/*" ]
+      "dome/*": [ "src/dome/src/renderer/*" ],
+      "codemirror/lib/codemirror.js": ["node_modules/@types/codemirror/index.d.ts"],
     },
     // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
     // "typeRoots": [],                       /* List of folders to include type definitions from. */

ivette/yarn.lock

@@ -993,10 +993,10 @@
   resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
   integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==
 
-"@types/codemirror@^0.0.89":
-  version "0.0.89"
-  resolved "https://registry.yarnpkg.com/@types/codemirror/-/codemirror-0.0.89.tgz#c3627a8a85a2b3a61110f05ab1949f92451e8662"
-  integrity sha512-kLw8yUzz1dTAHQh+WYA/2Ka7YZUf5h3oHzgwP48xhbfmqqxrfp9lWuP9Ro26SUDHTthVl5afAa+DabsL1KD5oQ==
+"@types/codemirror@^0.0.97":
+  version "0.0.97"
+  resolved "https://registry.yarnpkg.com/@types/codemirror/-/codemirror-0.0.97.tgz#6f2d8266b7f1b34aacfe8c77221fafe324c3d081"
+  integrity sha512-n5d7o9nWhC49DjfhsxANP7naWSeTzrjXASkUDQh7626sM4zK9XP2EVcHp1IcCf/IPV6c7ORzDUDF3Bkt231VKg==
   dependencies:
     "@types/tern" "*"