Fix position calculations when offset is missing (#1983)

romainmenke · web-flow · commit 345063010bf5 · 2024-11-11T20:55:58.000+01:00
diff --git a/lib/node.js b/lib/node.js
@@ -32,6 +32,36 @@ function cloneNode(obj, parent) {
   return cloned
 }
 
+function sourceOffset(inputCSS, position) {
+  // Not all custom syntaxes support `offset` in `source.start` and `source.end`
+  if (
+    position &&
+    typeof position.offset !== 'undefined'
+  ) {
+    return position.offset;
+  }
+
+  let column = 1
+  let line = 1
+  let offset = 0
+
+  for (let i = 0; i < inputCSS.length; i++) {
+    if (line === position.line && column === position.column) {
+      offset = i
+      break
+    }
+
+    if (inputCSS[i] === '\n') {
+      column = 1
+      line += 1
+    } else {
+      column += 1
+    }
+  }
+
+  return offset
+}
+
 class Node {
   constructor(defaults = {}) {
     this.raws = {}
@@ -174,12 +204,15 @@ class Node {
     return this.parent.nodes[index + 1]
   }
 
-  positionBy(opts, stringRepresentation) {
+  positionBy(opts) {
     let pos = this.source.start
     if (opts.index) {
       pos = this.positionInside(opts.index)
     } else if (opts.word) {
-      stringRepresentation = this.source.input.css.slice(this.source.start.offset, this.source.end.offset)
+      let stringRepresentation = this.source.input.css.slice(
+        sourceOffset(this.source.input.css, this.source.start),
+        sourceOffset(this.source.input.css, this.source.end)
+      )
       let index = stringRepresentation.indexOf(opts.word)
       if (index !== -1) pos = this.positionInside(index)
     }
@@ -189,7 +222,7 @@ class Node {
   positionInside(index) {
     let column = this.source.start.column
     let line = this.source.start.line
-    let offset = this.source.start.offset
+    let offset = sourceOffset(this.source.input.css, this.source.start)
     let end = offset + index
 
     for (let i = offset; i < end; i++) {
@@ -226,13 +259,15 @@ class Node {
         }
 
     if (opts.word) {
-      let stringRepresentation = this.source.input.css.slice(this.source.start.offset, this.source.end.offset)
+      let stringRepresentation = this.source.input.css.slice(
+        sourceOffset(this.source.input.css, this.source.start),
+        sourceOffset(this.source.input.css, this.source.end)
+      )
       let index = stringRepresentation.indexOf(opts.word)
       if (index !== -1) {
-        start = this.positionInside(index, stringRepresentation)
+        start = this.positionInside(index)
         end = this.positionInside(
           index + opts.word.length,
-          stringRepresentation
         )
       }
     } else {
diff --git a/test/node.test.ts b/test/node.test.ts
@@ -483,6 +483,22 @@ test('rangeBy() returns range for word', () => {
   })
 })
 
+test('rangeBy() returns range for word when offsets are missing', () => {
+  let css = parse('a {  one: X  }')
+  let a = css.first as Rule
+  let one = a.first as Declaration
+
+  // @ts-expect-error
+  if (one.source?.start) delete one.source.start.offset;
+  // @ts-expect-error
+  if (one.source?.end) delete one.source.end.offset;
+
+  equal(one.rangeBy({ word: 'one' }), {
+    end: { column: 9, line: 1 },
+    start: { column: 6, line: 1 }
+  })
+})
+
 test('rangeBy() returns range for word even after AST mutations', () => {
   let css = parse('a {\n\tone: 1;\n\ttwo: 2;}')
   let a = css.first as Rule
@@ -510,6 +526,42 @@ test('rangeBy() returns range for word even after AST mutations', () => {
   })
 })
 
+test('rangeBy() returns range for word even after AST mutations when offsets are missing', () => {
+  let css = parse('a {\n\tone: 1;\n\ttwo: 2;}')
+  let a = css.first as Rule
+  let one = a.first as Declaration
+  let two = one.next() as Declaration
+
+  // @ts-expect-error
+  if (a.source?.start) delete a.source.start.offset;
+  // @ts-expect-error
+  if (a.source?.end) delete a.source.end.offset;
+  // @ts-expect-error
+  if (two.source?.start) delete two.source.start.offset;
+  // @ts-expect-error
+  if (two.source?.end) delete two.source.end.offset;
+
+  equal(a.rangeBy({ word: 'two' }), {
+    end: { column: 5, line: 3 },
+    start: { column: 2, line: 3 }
+  })
+  equal(two.rangeBy({ word: 'two' }), {
+    end: { column: 5, line: 3 },
+    start: { column: 2, line: 3 }
+  })
+
+  one.remove()
+
+  equal(a.rangeBy({ word: 'two' }), {
+    end: { column: 5, line: 3 },
+    start: { column: 2, line: 3 }
+  })
+  equal(two.rangeBy({ word: 'two' }), {
+    end: { column: 5, line: 3 },
+    start: { column: 2, line: 3 }
+  })
+})
+
 test('rangeBy() returns range for index and endIndex', () => {
   let css = parse('a {  one: X  }')
   let a = css.first as Rule
@@ -520,6 +572,22 @@ test('rangeBy() returns range for index and endIndex', () => {
   })
 })
 
+test('rangeBy() returns range for index and endIndex when offsets are missing', () => {
+  let css = parse('a {  one: X  }')
+  let a = css.first as Rule
+  let one = a.first as Declaration
+
+  // @ts-expect-error
+  if (one.source?.start) delete one.source.start.offset;
+  // @ts-expect-error
+  if (one.source?.end) delete one.source.end.offset;
+
+  equal(one.rangeBy({ endIndex: 3, index: 1 }), {
+    end: { column: 9, line: 1 },
+    start: { column: 7, line: 1 }
+  })
+})
+
 test('rangeBy() returns range for index and endIndex after AST mutations', () => {
   let css = parse('a {\n\tone: 1;\n\ttwo: 2;}')
   let a = css.first as Rule
