Skip to content

Commit

Permalink
Use relative file location in source maps with `relativeSourceLocatio…
Browse files Browse the repository at this point in the history
…n` enabled (#5464)

## Summary

This option was added back when source maps were not included in
#3141.

Source map addition for better LogBox experience was added in
#3846 -
but it didn't take into account `relativeSourceLocation`. This PR fixes
this and there is no more absolute location in the source map while
`relativeSourceLocation` is on.

I haven't found a way to generate the source map with relative location
out-of-the-box.

## Test plan

In `WorkletExample` see that LogBox is working as intended. Also plugin
tests maybe.
  • Loading branch information
tjzel committed Dec 22, 2023
1 parent 1932f8d commit f40ee24
Show file tree
Hide file tree
Showing 3 changed files with 26 additions and 3 deletions.
19 changes: 18 additions & 1 deletion __tests__/plugin.test.ts
@@ -1,6 +1,6 @@
import { html } from 'code-tag';
import plugin from '../plugin';
import { TransformOptions, transformSync } from '@babel/core';
import { BabelFileResult, TransformOptions, transformSync } from '@babel/core';
import traverse from '@babel/traverse';
import { strict as assert } from 'assert';
import '../plugin/jestUtils';
Expand Down Expand Up @@ -97,6 +97,23 @@ describe('babel plugin', () => {
);
});

it('uses relative source location when `relativeSourceLocation` is set to `true`', () => {
process.env.REANIMATED_JEST_SHOULD_MOCK_SOURCE_MAP = '0'; // don't mock source maps
const input = html`<script>
function foo() {
'worklet';
var foo = 'bar';
}
</script>`;

const { code } = runPlugin(input, undefined, {
relativeSourceLocation: true,
});

const matches = code?.match(new RegExp(`..${MOCK_LOCATION}`, 'g'));
expect(matches).toHaveLength(2);
});

it('removes comments from worklets', () => {
const input = html`<script>
const f = () => {
Expand Down
3 changes: 2 additions & 1 deletion plugin/build/plugin.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

7 changes: 6 additions & 1 deletion plugin/src/makeWorklet.ts
Expand Up @@ -107,7 +107,7 @@ export function makeWorklet(
? functionExpression(null, clone.params, clone.body)
: clone;

const [funString, sourceMapString] = buildWorkletString(
let [funString, sourceMapString] = buildWorkletString(
transformed.ast,
variables,
functionName,
Expand Down Expand Up @@ -155,6 +155,11 @@ export function makeWorklet(
let location = state.file.opts.filename;
if (state.opts.relativeSourceLocation) {
location = relative(state.cwd, location);
// It seems there is no designated option to use relative paths in generated sourceMap
sourceMapString = sourceMapString?.replace(
state.file.opts.filename,
location
);
}

initDataObjectExpression.properties.push(
Expand Down

0 comments on commit f40ee24

Please sign in to comment.