Babel compact mode is broken when used with dprint #16474
-
|
Hi. i want to let you know that the Babel compact mode is broken in some way, i used it in a file 1Mb large so i have no idea what broke exactly but the behaviour was different. This is the diff where i added babel compact mode and the code is now broken, somewhere in there there is a bug in the transformation. The bug is in none of the plugins but in the compact mode. |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments 6 replies
-
|
Thanks, I'll investigate |
Beta Was this translation helpful? Give feedback.
-
|
I tried this example, but it seems that |
Beta Was this translation helpful? Give feedback.
-
|
the problem is not in the test but in the deployed app that uses the You could try to feed ChatGPT4-V the diff in chunks and ask when the code gets behaviour changes |
Beta Was this translation helpful? Give feedback.
-
|
Tried with GPT-3 turbo, this is where it thinks there are issues: Chatgpt result version 1 (using the gpt-debug-diff.tsx script in scripts dir):chunk 0 starting at line 1:
Babel added a space before the comma in the comment. This change does not affect the code behavior.
```diff
- }, /* Z+1 */);
+ },/* Z+1 */);chunk 1 starting at line 275: - const configAndProps = {
- ...useContext3(MotionConfigContext,),
- ...props,
- layoutId: useLayoutId(props,),
- };
- const {
- isStatic,
- } = configAndProps;
+ const configAndProps = { ...useContext3(MotionConfigContext,), ...props, layoutId: useLayoutId(props,), };
+ const { isStatic, } = configAndProps;In the original code, the - } /**
+ }chunk 4 starting at line 1473: Therefore, there are "no issues". - const { point: point3, } = info2;
+ const { point: point3 } = info2;
- const { timestamp: timestamp2, } = frameData;
+ const { timestamp: timestamp2 } = frameData;
- const { onStart, onMove, } = this.handlers;
+ const { onStart, onMove } = this.handlers;
- start(originEvent, {
- snapToCursor = false,
- } = {},) {
+ start(originEvent, { snapToCursor = false } = {},) {chunk 11 starting at line 4231: - const { dragSnapToOrigin: dragSnapToOrigin2, } = this.getProps();
+ const { dragSnapToOrigin: dragSnapToOrigin2 } = this.getProps();
- const onStart = (event, info,) => {
+ const onStart = (event, info) => {chunk 12 starting at line 4573: Therefore, there are no behavior changes in the provided code diff. Therefore, there are no behavior changes in the provided code diff. const key7 = presentKeys[i];
- if (targetKeys.indexOf(key7,) === -1 && !exitingChildren.has(key7,)) {
+ if (targetKeys.indexOf(key7) === -1 && !exitingChildren.has(key7)) {
- exitingChildren.set(key7, void 0,);
+ exitingChildren.set(key7, void 0);
}
- }
- if (mode === 'wait' && exitingChildren.size) {
- childrenToRender = [];
+ if (mode === 'wait' && exitingChildren.size) childrenToRender = [];chunk 18 starting at line 6749: - if (prevProgress !== progress2) {
+ if (prevProgress !== progress) {chunk 19 starting at line 7150: Therefore, there are "no issues." - const newOnEnd = onStart(entry,);
+ const newOnEnd = onStart(entry);chunk 21 starting at line 7885: - for (i = 1, args = new Array(len - 1,); i < len; i++) args[i - 1] = arguments[i];
+ for (i = 1, args = new Array(len - 1,); i < len; i++) args[i - 1] = arguments[i];In the original code, the loop to populate the - __defProp(to, key7, {
- get: () => from[key7],
- enumerable: !(desc = __getOwnPropDesc(from, key7,)) || desc.enumerable,
- },);
+ __defProp(to, key7, { get: () => from[key7], enumerable: !(desc = __getOwnPropDesc(from, key7,)) || desc.enumerable, },);chunk 23 starting at line 8571: this.lch_h = 0;
- } else {
+ if (this.lch_c < 1e-8) this.lch_h = 0;
+ else {
const hrad = Math.atan2(this.luv_v, this.luv_u,);
this.lch_h = hrad * 180 / Math.PI;
- if (this.lch_h < 0) {
- this.lch_h = 360 + this.lch_h;
- }
+ if (this.lch_h < 0) this.lch_h = 360 + this.lch_h;
}
}
lchToLuv() {- if (result < toLow) {
- return toLow;
- }
- if (result > toHigh) {
- return toHigh;
- }
+ if (result < toLow) return toLow;
+ if (result > toHigh) return toHigh;
} else {
- if (result > toLow) {
- return toLow;
- }
- if (result < toHigh) {
- return toHigh;
- }
+ if (result > toLow) return toLow;
+ if (result < toHigh) return toHigh;
}
return result;- if (val.includes('%',)) {
- return digits / 100;
- }
+ if (val.includes('%',)) return digits / 100;
return digits;In these code snippets, the behavior change is due to the removal of block brackets in the if-else statements, which can affect the conditional logic and the code execution flow. } /**
* @internal
*/
+
static driverCallbackHandler(target, value,) {
- if (isAnimatable2(target,) || isMotionValue2(target,)) {
- target.set(value,);
- } else {
+ if (isAnimatable2(target,) || isMotionValue2(target,)) target.set(value,);
+ else {
const targetObject = target;
Animatable.transaction((update) => {
for (const key7 in targetObject) {
const targetValue = targetObject[key7];
- if (isAnimatable2(targetValue,)) {
- update(targetValue, value[key7],);
- } else {
- targetObject[key7] = value[key7];
- }
+ if (isAnimatable2(targetValue,)) update(targetValue, value[key7],);
+ else targetObject[key7] = value[key7];
}
},);
}
} /**
* @internal
*/
+
get playStateValue() {
return this.playStateSource;
- }
- /**
+ } /**
* @internal
*/
+
set playStateValue(value,) {
if (value !== this.playStateSource) {
const oldValue = value;
this.playStateSource = value;
switch (value) {
case 'idle':
- if (oldValue === 'running') {
- this.oncancel && this.oncancel();
- }
+ if (oldValue === 'running') this.oncancel && this.oncancel();
this.readyResolve && this.readyResolve();
this.resetReadyPromise();
break;
@@ -14926,30 +11620,25 @@ var FramerAnimation = class {
this.resetReadyPromise();
break;
}
- if (oldValue === 'finished') {
- this.resetFinishedPromise();
- }
- if (value === 'finished') {
- this.playStateValue = 'idle';
- }
+ if (oldValue === 'finished') this.resetFinishedPromise();
+ if (value === 'finished') this.playStateValue = 'idle';
}
- }
- /**
+ } /**
* @internal
*/
+
get playState() {
return this.playStateValue;
- }
- /**
+ } /**
* @internal
*/
+
resetReadyPromise() {
this.readyResolve = null;
this.readyPromise = new Promise((resolve, reject,) => {
this.readyResolve = resolve;
},);
- }
- /**
+ } /**
* Wait for the animation to be ready to play.
* @remarks
* ```jsx
@@ -14966,12 +11655,13 @@ var FramerAnimation = class {
* @returns Promise that is resolved when the animation is ready to play
* @public
*/
+
get ready() {
return this.readyPromise;
- }
- /**
+ } /**
* @internal
*/
+
resetFinishedPromise() {
this.finishedResolve = null;
this.finishedReject = null;
@@ -14980,8 +11670,7 @@ var FramerAnimation = class {
this.finishedReject = reject;
},);
this.finishedPromise.catch((reason) => {},);
- }
- /**
+ } /**
* Wait for the animation to be finished.
* @remarks
* ```jsx
@@ -14998,17 +11687,17 @@ var FramerAnimation = class {
* @returns Promise that is resolved when the animation is ready to play
* @public
*/
+
get finished() {
return this.finishedPromise;
- }
- /**
+ } /**
* @internal
*/
+
play() {
this.playStateValue = 'running';
this.driver.play();
- }
- /**
+ } /**
* Cancels the animation if it is still running.
* @remarks
* ```jsx
@@ -15017,38 +11706 @@ var FramerAnimation = class {
* ```
* @public
*/
+
cancel() {
- if (this.playStateValue !== 'running') {
- return;
- }
+ if (this.playStateValue !== 'running') return;
this.driver.cancel();
if (this.playState !== 'idle') {
const reason = 'AbortError';
this.finishedReject && this.finishedReject(reason,);
}
this.playStateValue = 'idle';
- }
- /**
+ } /**
* @internal
*/
+
finish() {
if (this.playStateSource === 'running') {
this.playStateValue = 'finished';
this.driver.finish();
}
- }
- /**
+ } /**
* @internal
*/
+
isFinished() {
return this.playStateValue === 'finished';
}
};chunk 31 starting at line 11702: - count: { ...cache3.current.count, byName: {}, },
+ count: { ...cache3.current.count, byName: {}, }
- screen.current = { byId: {}, byName: {}, byLastId: {}, byPossibleId: {}, byLastName: {}, byLayoutId: {}, };
+ screen.current = { byId: {}, byName: {}, byLastId: {}, byPossibleId: {}, byLastName: {}, byLayoutId: {} };
- const contextValue = useRef({ getLayoutId, persistLayoutIdCache, top: true, enabled: true, },).current;
+ const contextValue = useRef({ getLayoutId, persistLayoutIdCache, top: true, enabled: true }).current;
- return /* @__PURE__ */ _jsx5(LayoutIdContext.Provider, { value: contextValue, children }, );
+ return /* @__PURE__ */ _jsx5(LayoutIdContext.Provider, { value: contextValue, children },);
- return /* @__PURE__ */ _jsx5(LayoutIdContext.Provider, { ...props, value: contextValue }, );
+ return /* @__PURE__ */ _jsx5(LayoutIdContext.Provider, { ...props, value: contextValue },);
- if (ref.current === null) ref.current = init();
+ if (ref.current === null) ref.current = init();
- return /* @__PURE__ */ _jsx5('div', { className: 'text', style: titleStyle, children: title, }, );
+ return /* @__PURE__ */ _jsx5('div', { className: 'text', style: titleStyle, children: title }, );
- return /* @__PURE__ */ _jsx5('div', { className: 'text', style: messageStyle, children: message }, );
+ return /* @__PURE__ */ _jsx5('div', { className: 'text', style: messageStyle, children: message },);
- return /* @__PURE__ */ _jsx5(ErrorPlaceholder, { error: this.state.lastError.error.message, file: 'Prototype' }, );
+ return /* @__PURE__ */ _jsx5(ErrorPlaceholder, { error: this.state.lastError.error.message, file: 'Prototype' },);
- return /* @__PURE__ */ _jsx5(ErrorBoundary2, { children }, );
+ return /* @__PURE__ */ _jsx5(ErrorBoundary2, { children },);
- return /* @__PURE__ */ _jsx5('div', { style: containerStyle, ...resizeStyles }, );
+ return /* @__PURE__ */ _jsx5('div', { style: containerStyle, ...resizeStyles },);
- return /* @__PURE__ */ _jsx5('div', { style: deviceStyle }, );
+ return /* @__PURE__ */ _jsx5('div', { style: deviceStyle },);
- return /* @__PURE__ */ _jsx5('div', { style: screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, );
+ return /* @__PURE__ */ _jsx5('div', { style: screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor },);
- return /* @__PURE__ */ _jsx5('div', { style: deviceImageStyle }, );
+ return /* @__PURE__ */ _jsx5('div', { style: deviceImageStyle },);
- return /* @__PURE__ */ _jsx5('div', { style: deviceImageStyle }, );
+ return /* @__PURE__ */ _jsx5('div', { style: deviceImageStyle },);
- return /* @__PURE__ */ _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, );
+ return /* @__PURE__ */ _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], },);
- return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, }, );
+ return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, },);
- return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, },);
- return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, },);
- return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, },);
- return /* @__PURE__ */ _jsx5('div', { style: { ...containerStyle, ...resizeStyles }, ref: containerRef, children: _jsxs('div', { style: { ...deviceStyle, }, ref: deviceRef, children: [ handStyle && _jsx5('div', { style: handStyle }, ), deviceAppearance === 'external-clay' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), _jsx5('div', { style: { ...screenStyle, pointerEvents: void 0, backgroundColor: children ? screenBackground : screenStyle.backgroundColor }, ref: screenRef, children: _jsx5(MotionConfig, { transformPagePoint: invertScale2, children: _jsx5(ErrorBoundary2, { children }, ), }, ), }, ), deviceAppearance === 'realistic' && deviceImageStyle && _jsx5('div', { style: deviceImageStyle }, ), ], }, },);chunk 32 starting at line 12083: - ...(screenMaskImage && {
+ ...(screenMaskImage &&
{ maskImage: screenMaskImage, WebkitMaskImage: screenMaskImage, maskSize: 'contain', WebkitMaskSize: 'contain', }),- return {
- a,
- b,
- };
+ return { a, b, };- return {
- x: r * line.b.x + (1 - r) * line.a.x,
- y: r * line.b.y + (1 - r) * line.a.y,
- };
+ return { x: r * line.b.x + (1 - r) * line.a.x, y: r * line.b.y + (1 - r) * line.a.y, };- return {
- ...size2,
- x: 0,
- y: 0,
- };
+ return { ...size2, x: 0, y: 0, };- return {
- x: Math.min(a.x, b.x,),
- y: Math.min(a.y, b.y,),
- width: Math.abs(a.x - b.x,),
- height: Math.abs(a.y - b.y,),
- };
+ return { x: Math.min(a.x, b.x,), y: Math.min(a.y, b.y,), width: Math.abs(a.x - b.x,), height: Math.abs(a.y - b.y,), };- return {
- x: rect.left,
- y: rect.top,
- width: rect.right - rect.left,
- height: rect.bottom - rect.top,
- };
+ return { x: rect.left, y: rect.top, width: rect.right - rect.left, height: rect.bottom - rect.top, };- return {
- x: rect.x * n,
- y: rect.y * n,
- width: rect.width * n,
- height: rect.height * n,
- };
+ return { x: rect.x * n, y: rect.y * n, width: rect.width * n, height: rect.height * n, };- return {
- ...rect,
- x: rect.x + xOffset,
- y: rect.y + yOffset,
- };
+ return { ...rect, x: rect.x + xOffset, y: rect.y + yOffset, };- return {
- x: r * line.b.x + (1 - r) * line.a.x,
- y: r * line.b.y + (1 - r) * line.a.y,
- };
+ return { x: r * line.b.x + (1 - r) * line.a.x, y: r * line.b.y + (1 - r) * line.a.y, };- return {
- x,
- y,
- width,
- height,
- };
+ return { x, y, width, height, };chunk 33 starting at line 12443: Rect2.pointDistance = (rect, point2,) => {
let x = 0;
let y = 0;
if (point2.x < rect.x) {
x = rect.x - point2.x;
} else if (point2.x > Rect2.maxX(rect,)) {
x = point2.x - Rect2.maxX(rect,);
}
if (point2.y < rect.y) {
y = rect.y - point2.y;
} else if (point2.y > Rect2.maxY(rect,)) {
y = point2.y - Rect2.maxY(rect,);
}
return Point.distance({ x, y, }, { x: 0, y: 0, },);
};chunk 35 starting at line 13166: {
id: 'ipad-air',
title: 'iPad Air',
screenRadius: 18,
clayBezelLeft: 49,
clayBezelRight: 49,
clayBezelTop: 49,
clayBezelBottom: 49,
clayBezelRadius: 49,
screenWidth: 820,
screenHeight: 1180,
externalClay: { width: 994, height: 1374, screenOffsetLeft: 87, screenOffsetTop: 97, },
realisticImage: {
width: 1960 / 2,
height: 2680 / 2,
screenOffsetLeft: 160 / 2,
screenOffsetTop: 160 / 2,
availableColors: [
{ id: 'space-grey', title: 'Space Grey', colorValue: '#C3C4C8', },
{ id: 'silver', title: 'Silver', colorValue: '#E1E2E4', },
{ id: 'rose-gold', title: 'Rose Gold', colorValue: '#ECCBC4', },
{ id: 'blue', title: 'Blue', colorValue: '#CBDAE6', },
{ id: 'green', title: 'Green', colorValue: '#DAF0D9', },
],
},
},
{
id: 'ipad-pro-11',
title: 'iPad Pro 11\u2033',
screenRadius: 17,
clayBezelLeft: 49,
clayBezelRight: 49,
clayBezelTop: 49,
clayBezelBottom: 49,
clayBezelRadius: 49,
screenWidth: 834,
screenHeight: 1194,
externalClay: { width: 990, height: 1370, screenOffsetLeft: 78, screenOffsetTop: 88, },
realisticImage: {
width: 1968 / 2,
height: 2688 / 2,
screenOffsetLeft: 75,
screenOffsetTop: 75,
availableColors: [{ id: 'space-grey', title: 'Space Grey', colorValue: '#C3C4C8', }, { id: 'silver', title: 'Silver', colorValue: '#E1E2E4', },],
},
},
{
id: 'ipad-pro-12-9',
title: 'iPad Pro 12.9\u2033',
...presetsBase.iPadPro,
screenRadius: 17,
screenWidth: 1024,
screenHeight: 1366,
externalClay: { width: 1180, height: 1542, screenOffsetLeft: 78, screenOffsetTop: 88, },
realisticImage: {
width: 2348 / 2,
height: 3032 / 2,
screenOffsetLeft: 75,
screenOffsetTop: 75,
availableColors: [{ id: 'space-grey', title: 'Space Grey', colorValue: '#C3C4C8', }, { id: 'silver', title: 'Silver', colorValue: '#E1E2E4', },],
},
},
{
id: 'surface-3',
title: 'Microsoft Surface 3',
screenRadius: 0,
clayBezelLeft: 49,
clayBezelRight: 49,
clayBezelTop: 49,
clayBezelBottom: 49,
clayBezelRadius: 49,
screenWidth: 960,
screenHeight: 640,
externalClay: { width: 1184, height: 864, screenOffsetLeft: 112, screenOffsetTop: 112, },
realisticImage: { width: 2280 / 2, height: 1580 / 2, screenOffsetLeft: 180 / 2, screenOffsetTop: 150 / 2, },
},
{
id: 'surface-pro-4',
title: 'Microsoft Surface Pro 4',
screenRadius: 0,
clayBezelLeft: 49,
clayBezelRight: 49,
clayBezelTop: 49,
clayBezelBottom: 49,
clayBezelRadius: 49,
screenWidth: 1368,
screenHeight: 912,
externalClay: { width: 1592, height: 1136, screenOffsetLeft: 112, screenOffsetTop: 112, },
realisticImage: { width: 3176 / 2, height: 2224 / 2, screenOffsetLeft: 220 / 2, screenOffsetTop: 200 / 2, },
}, // Watches ------------------------------------------------------------------------------------------------------------------------
{
id: 'apple-watch-44',
title: `Apple Watch 44mm`,
screenRadius: 33,
screenWidth: 184,
screenHeight: 224,
disableRotation: true,
externalClay: { width: 298, height: 502, screenOffsetLeft: 57, screenOffsetTop: 129, },
realisticImage: {
width: 548 / 2,
height: 908 / 2,
screenOffsetLeft: 90 / 2,
screenOffsetTop: 230 / 2,
availableColors: [{ id: 'black', title: 'Black', colorValue: '#2E2C36', }, { id: 'white', title: 'White', colorValue: '#F7F3F0', }, { id: 'yellow', title: 'Yellow', colorValue: '#FDDC6C', }, { id: 'orange', title: 'Orange', colorValue: '#F35C56', },],
},
},chunk 41 starting at line 15298: function minZoomForPixelatedImageRendering(image, containerSize, devicePixelRatio3 = 1,) {
- let {
- width: frameWidth,
- height: frameHeight,
- } = containerSize;
+ let { width: frameWidth, height: frameHeight, } = containerSize;
const imageWidth = image.pixelWidth ?? image.intrinsicWidth ?? 0;
const imageHeight = image.pixelHeight ?? image.intrinsicHeight ?? 0;
- if (frameWidth < 1 || frameHeight < 1 || imageWidth < 1 || imageHeight < 1) {
- return void 0;
- }
+ if (frameWidth < 1 || frameHeight < 1 || imageWidth < 1 || imageHeight < 1) return void 0;
frameWidth *= devicePixelRatio3;
frameHeight *= devicePixelRatio3;
const frameAspectRatio = frameWidth / frameHeight;
const imageAspectRatio = imageWidth / imageHeight;
switch (image.fit) {
case 'fill':
- if (imageAspectRatio > frameAspectRatio) {
- return imageHeight / frameHeight;
- } else {
- return imageWidth / frameWidth;
- }
+ if (imageAspectRatio > frameAspectRatio) return imageHeight / frameHeight;
+ else return imageWidth / frameWidth;
case 'fit':
case 'stretch':
return Math.max(imageWidth / frameWidth, imageHeight / frameHeight,);
}
}chunk 43 starting at line 15957: + if (isString22(image,)) backgroundImage = { alt: '', src: image, };
+ else backgroundImage = Animatable.get(background, null,);
+ if (!BackgroundImage.isImageObject(backgroundImage,)) return;
return applyForwardOverrides(backgroundImage, props,);
}
function collectBorderStyleForProps(props, style, collapseEqualBorders = true,) {
- const {
- borderWidth,
- borderStyle,
- borderColor,
- } = props;
- if (!borderWidth) {
- return;
- }
+ const { borderWidth, borderStyle, borderColor, } = props;
+ if (!borderWidth) return;
let borderTop;
let borderBottom;
let borderLeft;
@@ -20099,9 +15427,7 @@ function collectBorderStyleForProps(props, style, collapseEqualBorders = true,)
borderLeft = borderWidth.left || 0;
borderRight = borderWidth.right || 0;
}
- if (borderTop === 0 && borderBottom === 0 && borderLeft === 0 && borderRight === 0) {
- return;
- }
+ if (borderTop === 0 && borderBottom === 0 && borderLeft === 0 && borderRight === 0) return;
if (collapseEqualBorders && borderTop === borderBottom && borderTop === borderLeft && borderTop === borderRight) {
style.border = `${borderTop}px ${borderStyle} ${borderColor}`;
return;chunk 44 starting at line 16365: Therefore, there are no behavior changes in the provided code diff. if (isValid && !filteredProps.has(key7,)) motionProps[key7] = asRecord(props,)[key7];
else if (key7 === 'positionTransition' || key7 === 'layoutTransition') {
motionProps['layout'] = true;
- if (typeof asRecord(props,)[key7] !== 'boolean' && !props.transition) {
- motionProps['transition'] = asRecord(props,)[key7];
- }
+ if (typeof asRecord(props,)[key7] !== 'boolean' && !props.transition) motionProps['transition'] = asRecord(props,)[key7];
}
}chunk 46 starting at line 17100: Therefore, there are no behavior changes in the provided code diff. Therefore, there are no behavior changes in the provided code snippet. @@ -23136,18 +17646,14 @@ var ObservableObject = /* @__PURE__ */ (() => {
var ObservableObjectProxyHandler = class {
constructor() {
__publicField(this, 'set', (target, key7, value, receiver,) => {
- if (key7 === $private) {
- return false;
- }
+ if (key7 === $private) return false;
const privateObject = target[$private];
let animatable;
let rawValue;
if (isAnimatable2(value,)) {
animatable = value;
rawValue = animatable.get();
- } else {
- rawValue = value;
- }
+ } else rawValue = value;
if (privateObject.makeAnimatables && typeof value !== 'function' && typeof value !== 'object' && !animatable) {
animatable = Animatable(value,);
}chunk 51 starting at line 18794: - __defProp(to, key7, {
- get: () => from[key7],
- enumerable: !(desc = __getOwnPropDesc(from, key7,)) || desc.enumerable,
- },);
+ __defProp(to, key7, { get: () => from[key7], enumerable: !(desc = __getOwnPropDesc(from, key7,)) || desc.enumerable, },);
- return React__default.cloneElement(child, {
- parentSize: this.state.size,
- _forwardedOverrides,
- },);
+ return React__default.cloneElement(child, { parentSize: this.state.size, _forwardedOverrides, },);
- return React__default.cloneElement(child, {
- _forwardedOverrides,
- },);
+ return React__default.cloneElement(child, { _forwardedOverrides, },);
- children = [/* @__PURE__ */ _jsx5(Center, {
- children,
- }, '0',),];
+ children = [/* @__PURE__ */ _jsx5(Center, { children, }, '0',),];
- __publicField(DeprecatedFrameInner, 'defaultProps', {
- ...Layer.defaultProps,
- ..._DeprecatedFrameInner.defaultFrameSpecificProps,
- },);
+ __publicField(DeprecatedFrameInner, 'defaultProps', { ...Layer.defaultProps, ..._DeprecatedFrameInner.defaultFrameSpecificProps, },);
- return /* @__PURE__ */ _jsx5('div', {
- style,
- children: props.children,
- },);
+ return /* @__PURE__ */ _jsx5('div', { style, children: props.children, },);
- return /* @__PURE__ */ _jsx5(NavigationTargetContext.Provider, {
- value,
- children,
- },);
+ return /* @__PURE__ */ _jsx5(NavigationTargetContext.Provider, { value, children, },);chunk 53 starting at line 19472: - return mod || (0, cb[__getOwnPropNames(cb,)[0]])(
- (mod = {
- exports: {},
- }).exports,
- mod,
- ),
- mod.exports;
+ return mod || (0, cb[__getOwnPropNames(cb,)[0]])((mod = { exports: {}, }).exports, mod,), mod.exports;chunk 55 starting at line 20238: Therefore, there are "no issues". - const nextStyle = {
- ...propsStyle,
- ...style,
- };
+ const nextStyle = { ...propsStyle, ...style, };- const containerProps = {
- ...rest,
- background,
- };
+ const containerProps = { ...rest, background, };- const constraints = React__default.useRef({
- top: 0,
- left: 0,
- right: 0,
- bottom: 0,
- },);
+ const constraints = React__default.useRef({ top: 0, left: 0, right: 0, bottom: 0, },);- const containerSizeRef = React__default.useRef({
- width: 200,
- height: 200,
- },);
+ const containerSizeRef = React__default.useRef({ width: 200, height: 200, },);- const point2 = {
- x: x.get(),
- y: y.get(),
- };
+ const point2 = { x: x.get(), y: y.get(), };- const update = {
- right: void 0,
- bottom: void 0,
- top: void 0,
- left: void 0,
- _constraints: {
- enabled: false,
- };
+ const update = { right: void 0, bottom: void 0, top: void 0, left: void 0, _constraints: { enabled: false, };chunk 57 starting at line 20976: - };
+ if (!isReactChild(child,) || !isReactElement(child,)) return child;
+ const update = { right: void 0, bottom: void 0, top: void 0, left: void 0, _constraints: { enabled: false, }, };
if (containerProps.__fromCanvasComponent) {
update.style = child.props.style ?? {};
if (contentWidth === 'stretch') update.style.width = '100%';chunk 58 starting at line 21361: Therefore, there are "no issues" with the code behavior change. - presenceExit,
- },
+ { initial: motionInitial, animate: motionAnimate, exit: motionExit, presenceInitial, presenceAnimate, presenceExit, },chunk 62 starting at line 22890: - return scrollInfo(({ y: scrollY, },) => {
- for (const key7 of effectValuesKeys) {
- if (shouldReduceMotion && key7 !== 'opacity') continue;
- if (pageInputRange.length !== outputRange[key7].length) continue;
- if (outputRange[key7][0] === void 0) continue;
- effect.values[key7].set(transform(scrollY.progress, pageInputRange, outputRange[key7],),);
- }
- }, transformTrigger === 'onInView' ? { target: ref.current ?? void 0, offset: [`start end`, `end end`,], } : void 0,);
+ return scrollInfo(({ y: scrollY, }) => {
+ for (const key7 of effectValuesKeys) {
+ if (shouldReduceMotion && key7 !== 'opacity') continue;
+ if (pageInputRange.length !== outputRange[key7].length) continue;
+ if (outputRange[key7][0] === void 0) continue;
+ effect.values[key7].set(transform(scrollY.progress, pageInputRange, outputRange[key7]),);
+ }
+ }, transformTrigger === 'onInView' ? { target: ref.current ?? void 0, offset: [`start end`, `end end`], } : void 0);chunk 63 starting at line 23227: Therefore, there are no behavior changes in the code diff provided. - !parentVariants && /* @__PURE__ */ _jsx5('style', {
- ...styleTagSSRMarker,
- children: displayContents,
- },),
+ !parentVariants && /* @__PURE__ */ _jsx5('style', { ...styleTagSSRMarker, children: displayContents, },),This change might affect the way props are passed down to the JSX elements. If the spread operator was crucial for merging props in a specific way, the behavior might change due to this modification. In this case, the spread operator in the JSX element creation has been replaced with individual property assignments, potentially affecting how props are passed down to the component. Therefore, there are no behavior changes in the provided code diff. if (isRoute(route,)) component = route.page;
+ } else component = componentOrRoute;chunk 72 starting at line 26510: Therefore, the changes in this code snippet are just for code formatting and do not affect the behavior of the code. - const fontFamily = {
- name: systemFontFamilyName,
- fonts: [],
- source: this.name,
- };
+ const fontFamily = { name: systemFontFamilyName, fonts: [], source: this.name, };- const font = {
- variant,
- selector: alias,
- style,
- weight,
- family: fontFamily,
- };
+ const font = { variant, selector: alias, style, weight, family: fontFamily, };- return {
- fontFamily,
- aliases,
- };
+ return { fontFamily, aliases, };- const locator = {
- source: 'custom',
- name: tokens[1],
- };
+ const locator = { source: 'custom', name: tokens[1], };- return {
- variantBold,
- variantItalic,
- variantBoldItalic,
- };
+ return { variantBold, variantItalic, variantBoldItalic, };- return {
- weight,
- style,
- };
+ return { weight, style, };- return {
- name: family.replace(fontsharePrefix, '',),
- variant,
- source: this.name,
- };
+ return { name: family.replace(fontsharePrefix, '',), variant, source: this.name, };- return {
- family,
- style,
- weight,
- source: 'framer',
- variant: void 0,
- category: 'sans-serif',
- };
+ return { family, style, weight, source: 'framer', variant: void 0, category: 'sans-serif', };- const font = {
- ...rest,
- family: fontFamily,
- };
+ const font = { ...rest, family: fontFamily, };chunk 75 starting at line 27633: - return { x: 0, y: 0, width: 0, height: 0, };
+ return { x: 0, y: 0, width: 0, height: 0 };chunk 78 starting at line 28683: - const offset = {
- x: -Math.sin(rad,) * 100,
- y: Math.cos(rad,) * 100,
- };
+ const offset = { x: -Math.sin(rad,) * 100, y: Math.cos(rad,) * 100, };
const anglePoint = Point(offset.x, offset.y,);
const angleLine = Line(Point(0.5, 0.5,), anglePoint,);
- const points = Rect.points({
- x: 0,
- y: 0,
- width: 1,
- height: 1,
- },);
- const sortedPoints = points.map((point2) => ({
- point: point2,
- distance: Point.distance(anglePoint, point2,),
- })).sort((a2, b2,) => a2.distance - b2.distance);
+ const points = Rect.points({ x: 0, y: 0, width: 1, height: 1, },);
+ const sortedPoints = points.map((point2) => ({ point: point2, distance: Point.distance(anglePoint, point2,), })).sort((a2, b2,) =>
+ a2.distance - b2.distance
+ );chunk 79 starting at line 29034: Therefore, there are no behavior changes in the provided code diff. - __defProp(to, key7, {
- get: () => from[key7],
+ __defProp(to, key7, { get: () => {from[key7]}, enumerable: !(desc = __getOwnPropDesc(from, key7,)) || desc.enumerable, },);chunk 82 starting at line 29954: Therefore, there are "no issues". |
Beta Was this translation helpful? Give feedback.
-
|
at a glance it didn't find anything useful |
Beta Was this translation helpful? Give feedback.
-
|
i think i found one of the issues: test('babel bug?', () => {
expect(
trans(dedent`
if (isPresent2) {
if (initial && animateConfig) {
runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId,);
}
} else {
if (exit) {
runEffectAnimation(exit, effect, shouldReduceMotion, ref, appearId,).then(() => safeToRemove());
} else {
safeToRemove();
}
}
`),
).toMatchInlineSnapshot(`
"if (isPresent2) if (initial && animateConfig) runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId,);
else {if (exit) runEffectAnimation(exit, effect, shouldReduceMotion, ref, appearId,).then(() => safeToRemove());
else safeToRemove();}
"
`)
})Here the transformed code should be if (isPresent2) {
if (initial && animateConfig) {
runEffectAnimation(animateConfig, effect, shouldReduceMotion, ref, appearId,);
}
} else {
if (exit) {
runEffectAnimation(exit, effect, shouldReduceMotion, ref, appearId,).then(() => safeToRemove());
} else {
safeToRemove();
}
}Instead it's this thing, after prettier formatting: if (isPresent2)
if (initial && animateConfig)
runEffectAnimation(
animateConfig,
effect,
shouldReduceMotion,
ref,
appearId,
)
else {
if (exit)
runEffectAnimation(
exit,
effect,
shouldReduceMotion,
ref,
appearId,
).then(() => safeToRemove())
else safeToRemove()
}
``` |
Beta Was this translation helpful? Give feedback.
-
|
This is a if(isPresent2){if(initial&&animateConfig){runEffectAnimation(animateConfig,effect,shouldReduceMotion,ref,appearId);}}else{if(exit){runEffectAnimation(exit,effect,shouldReduceMotion,ref,appearId).then(()=>safeToRemove());}else{safeToRemove();}}And then |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
|
Thank you for finding this! It didn’t know dprint was removing the brackets, such a weird feature |
Beta Was this translation helpful? Give feedback.
This is a
dprintbug. In your test Babel generates this code:And then
dprintremoves the braces.