@parcel/codeframe - npm Package Compare versions

Comparing version 2.0.0-nightly.335 to 2.0.0-nightly.339

test/fixtures/a.js

+import test from 'test';
+import component from './component';
+
+/**
+ * This is a comment
+ */
+import Tooltip from '../tooltip';
+import VisuallyHidden from '../visually-hidden';
+
+/**
+ * This is another comment
+ */
+import {Label} from './label';

lib/codeframe.js

@@ -64,6 +64,6 @@ "use strict";
       lineNumber,
-      endLine,
+      lineNumberLength,
       isHighlighted
     } = params;
-    return `${isHighlighted ? highlighter('>') : ' '} ${lineNumber ? lineNumber.padEnd(endLine.length, ' ') : ' '.repeat(endLine.length)} | `;
+    return `${isHighlighted ? highlighter('>') : ' '} ${lineNumber ? lineNumber.padStart(lineNumberLength, ' ') : ' '.repeat(lineNumberLength)} | `;
   }; // Make columns/lines start at 1
@@ -91,5 +91,5 @@
   startLine = startLine < 0 ? 0 : startLine;
-  let endLine = lastHighlight.end.line + opts.padding.after;
-  endLine = endLine - startLine > opts.maxLines ? startLine + opts.maxLines - 1 : endLine;
-  let endLineString = endLine.toString(10); // Split input into lines and highlight syntax
+  let endLineIndex = lastHighlight.end.line + opts.padding.after;
+  endLineIndex = endLineIndex - startLine > opts.maxLines ? startLine + opts.maxLines - 1 : endLineIndex;
+  let lineNumberLength = (endLineIndex + 1).toString(10).length; // Split input into lines and highlight syntax
 
@@ -102,3 +102,3 @@ let lines = code.split(NEWLINE);
   for (let currentLineIndex = startLine; currentLineIndex < syntaxHighlightedLines.length; currentLineIndex++) {
-    if (currentLineIndex > endLine) break;
+    if (currentLineIndex > endLineIndex) break;
     if (currentLineIndex > syntaxHighlightedLines.length - 1) break; // Find highlights that need to get rendered on the current line
@@ -109,3 +109,3 @@
     let isWholeLine = lineHighlights.length && !!lineHighlights.find(h => h.start.line < currentLineIndex && h.end.line > currentLineIndex);
-    let lineLengthLimit = opts.terminalWidth > endLineString.length + 7 ? opts.terminalWidth - (endLineString.length + 5) : 10; // Split the line into line parts that will fit the provided terminal width
+    let lineLengthLimit = opts.terminalWidth > lineNumberLength + 7 ? opts.terminalWidth - (lineNumberLength + 5) : 10; // Split the line into line parts that will fit the provided terminal width
 
@@ -133,3 +133,3 @@ let colOffset = 0;
       lineNumber: (currentLineIndex + 1).toString(10),
-      endLine: endLineString,
+      lineNumberLength,
       isHighlighted: lineHighlights.length > 0
@@ -206,3 +206,3 @@ }) + syntaxHighlightedLine);
       resultLines.push(lineNumberPrefixer({
-        endLine: endLineString,
+        lineNumberLength,
         isHighlighted: true
@@ -209,0 +209,0 @@ }) + highlightLine);

package.json

 {
   "name": "@parcel/codeframe",
-  "version": "2.0.0-nightly.335+2928e0e7",
+  "version": "2.0.0-nightly.339+afc2c9ef",
   "description": "Blazing fast, zero configuration web application bundler",
@@ -31,3 +31,3 @@ "license": "MIT",
   },
-  "gitHead": "2928e0e7e748eb58806a0cc661558ae1b2dd4ee2"
+  "gitHead": "afc2c9efc2cfcd016bc743291706099eaab004e4"
 }

src/codeframe.js

@@ -74,11 +74,11 @@ // @flow
     lineNumber?: string,
-    endLine: string,
+    lineNumberLength: number,
     isHighlighted: boolean,
   |}) => {
-    let {lineNumber, endLine, isHighlighted} = params;
+    let {lineNumber, lineNumberLength, isHighlighted} = params;
 
     return `${isHighlighted ? highlighter('>') : ' '} ${
       lineNumber
-        ? lineNumber.padEnd(endLine.length, ' ')
-        : ' '.repeat(endLine.length)
+        ? lineNumber.padStart(lineNumberLength, ' ')
+        : ' '.repeat(lineNumberLength)
     } | `;
@@ -115,9 +115,10 @@ };
   startLine = startLine < 0 ? 0 : startLine;
-  let endLine = lastHighlight.end.line + opts.padding.after;
-  endLine =
-    endLine - startLine > opts.maxLines
+  let endLineIndex = lastHighlight.end.line + opts.padding.after;
+  endLineIndex =
+    endLineIndex - startLine > opts.maxLines
       ? startLine + opts.maxLines - 1
-      : endLine;
-  let endLineString = endLine.toString(10);
+      : endLineIndex;
 
+  let lineNumberLength = (endLineIndex + 1).toString(10).length;
+
   // Split input into lines and highlight syntax
@@ -139,3 +140,3 @@ let lines = code.split(NEWLINE);
   ) {
-    if (currentLineIndex > endLine) break;
+    if (currentLineIndex > endLineIndex) break;
     if (currentLineIndex > syntaxHighlightedLines.length - 1) break;
@@ -164,4 +165,4 @@
     let lineLengthLimit =
-      opts.terminalWidth > endLineString.length + 7
-        ? opts.terminalWidth - (endLineString.length + 5)
+      opts.terminalWidth > lineNumberLength + 7
+        ? opts.terminalWidth - (lineNumberLength + 5)
         : 10;
@@ -196,3 +197,3 @@
         lineNumber: (currentLineIndex + 1).toString(10),
-        endLine: endLineString,
+        lineNumberLength,
         isHighlighted: lineHighlights.length > 0,
@@ -282,3 +283,3 @@ }) + syntaxHighlightedLine,
         lineNumberPrefixer({
-          endLine: endLineString,
+          lineNumberLength,
           isHighlighted: true,
@@ -285,0 +286,0 @@ }) + highlightLine,

test/codeframe.test.js

 import assert from 'assert';
+import {readFileSync} from 'fs';
+import {join as joinPath} from 'path';
 
@@ -396,3 +398,3 @@ import codeframe from '../src/codeframe';
 
-  it('should properly pad numbers', () => {
+  it('should properly pad numbers for large files', () => {
     let codeframeString = codeframe('test\n'.repeat(1000), [
@@ -419,3 +421,3 @@ {
         },
-        message: 'test',
+        message: 'test 2',
       },
@@ -426,7 +428,12 @@ ]);
     assert.equal(lines.length, 7);
-    assert.equal(lines[0], '  98  | test');
+    assert.equal(lines[0], '   98 | test');
+    assert.equal(lines[1], '>  99 | test');
+    assert.equal(lines[2], '>     |  ^ test');
+    assert.equal(lines[3], '> 100 | test');
+    assert.equal(lines[4], '>     |  ^ test 2');
+    assert.equal(lines[5], '  101 | test');
     assert.equal(lines[6], '  102 | test');
   });
 
-  it('should properly pad numbers', () => {
+  it('should properly pad numbers for short files', () => {
     let codeframeString = codeframe('test\n'.repeat(1000), [
@@ -459,3 +466,6 @@ {
     assert.equal(lines.length, 11);
-    assert.equal(lines[0], '  6  | test');
+    assert.equal(lines[0], '   6 | test');
+    assert.equal(lines[4], '   9 | test');
+    assert.equal(lines[5], '  10 | test');
+    assert.equal(lines[6], '  11 | test');
     assert.equal(lines[10], '  14 | test');
@@ -465,4 +475,5 @@ });
   it('should properly use maxLines', () => {
+    let line = 'test '.repeat(100);
     let codeframeString = codeframe(
-      'test\n'.repeat(100),
+      `${line}\n`.repeat(100),
       [
@@ -495,2 +506,3 @@ {
         maxLines: 10,
+        terminalWidth: 5,
       },
@@ -501,5 +513,6 @@ );
     assert.equal(lines.length, 13);
-    assert.equal(lines[0], '  4  | test');
-    assert.equal(lines[11], '> 13 | test');
-    assert.equal(lines[12], '>    | ^^^^');
+    assert.equal(lines[0], '   4 | test test ');
+    assert.equal(lines[7], '  10 | test test ');
+    assert.equal(lines[11], '> 13 | test test ');
+    assert.equal(lines[12], '>    | ^^^^^^^^^^');
   });
@@ -751,2 +764,44 @@
   });
+
+  it('Should pad properly, T-650', () => {
+    let fileContent = readFileSync(
+      joinPath(__dirname, './fixtures/a.js'),
+      'utf8',
+    );
+    let codeframeString = codeframe(
+      fileContent,
+      [
+        {
+          start: {
+            line: 8,
+            column: 10,
+          },
+          end: {
+            line: 8,
+            column: 48,
+          },
+        },
+      ],
+      {
+        useColor: false,
+        syntaxHighlighting: false,
+        language: 'js',
+        terminalWidth: 100,
+      },
+    );
+
+    let lines = codeframeString.split(LINE_END);
+    assert.equal(lines.length, 5);
+    assert.equal(lines[0], `   7 | import Tooltip from '../tooltip';`);
+    assert.equal(
+      lines[1],
+      `>  8 | import VisuallyHidden from '../visually-hidden';`,
+    );
+    assert.equal(
+      lines[2],
+      '>    |          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^',
+    );
+    assert.equal(lines[3], '   9 | ');
+    assert.equal(lines[4], '  10 | /**');
+  });
 });

New alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Fixed alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38446

5.24%

Number of package files

6

20%

Lines of code

1170

5.79%

Worsened metrics

Number of low supply chain risk alerts

1

Infinity%

No dependency changes