Skip to content

Commit

Permalink
Fix edge cases triggered by newlines in arrow functions (#1217)
Browse files Browse the repository at this point in the history
This one is pretty crazy. In #927, I changed

```js
concat(["(", join(concat([", "]), printed), ")"]),
```

into

```js
concat(["(", join(concat([", "]), printedLastArgExpanded), ")"]),
```

which makes the example in #1203 look ugly. The crazy thing is that `JSON.stringify(printed) === JSON.stringify(printedLastArgExpanded)`. So they are deep equal but not the same object. In a non-mutative world, this should cause any problem, but we actually mutate those to propagate breaks.

In the break propagation, we only looked at the first one in case of a conditional group. But, because the two were the same object then it also applied to the second one and happened to be the correct behavior! When I changed that piece of code to be two distinct objects, it no longer worked by accident and caused a bunch of weird issues where breaks didn't propagate correctly.

The solution for this case is to propagate the breaks on all the conditions. I'm pretty sure that this is the expected behavior, we want to deeply recurse in all of them, we don't propagate it up the boundary anyway.

The other use case for `traverseInDoc()` is `findInDoc()`, right now it searches for the first conditional group but it seems very arbitrary. I changed it to not search on any and none of the tests are failing, so I think it's safe(tm). If it triggers weird behavior, then it'll at least be expected and not randomly explode at us if we move groups around.

I tried to go through all the conditions for `findInDoc()` but it triggers a few failures (the output look bad). I'm not really sure why. https://gist.github.com/vjeux/5fb7566cc3d65974817d512d1ef6abe1

Fix #1203
  • Loading branch information
vjeux committed Apr 13, 2017
1 parent 3709105 commit fe7ebc0
Show file tree
Hide file tree
Showing 3 changed files with 225 additions and 2 deletions.
11 changes: 9 additions & 2 deletions src/doc-utils.js
@@ -1,6 +1,6 @@
"use strict";

function traverseDoc(doc, onEnter, onExit) {
function traverseDoc(doc, onEnter, onExit, shouldTraverseConditionalGroups) {
var hasStopped = false;
function traverseDocRec(doc) {
if (onEnter) {
Expand All @@ -21,6 +21,12 @@ function traverseDoc(doc, onEnter, onExit) {
if (doc.flatContents) {
traverseDocRec(doc.flatContents);
}
} else if (doc.type === "group" && doc.expandedStates) {
if (shouldTraverseConditionalGroups) {
doc.expandedStates.forEach(traverseDocRec);
} else {
traverseDocRec(doc.contents);
}
} else if (doc.contents) {
traverseDocRec(doc.contents);
}
Expand Down Expand Up @@ -132,7 +138,8 @@ function propagateBreaks(doc) {
breakParentGroup(groupStack);
}
}
}
},
/* shouldTraverseConditionalGroups */ true
);
}

Expand Down
150 changes: 150 additions & 0 deletions tests/last_argument_expansion/__snapshots__/jsfmt.spec.js.snap
Expand Up @@ -94,6 +94,156 @@ true
`;
exports[`edge_case.js 1`] = `
var listener = DOM.listen(
introCard,
'click',
sigil,
(event: JavelinEvent): void =>
BanzaiLogger.log(
config,
{...logData, ...DataStore.get(event.getNode(sigil))},
),
);
a(
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong,
[
{
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong: 1
}
]
);
exports.examples = [
{
render: withGraphQLQuery(
'node(1234567890){image{uri}}',
function(container, data) {
return (
<div>
<InlineBlock>
<img
src={data[1234567890].image.uri}
style={{position: 'absolute', top: '0', left: '0', zIndex:'-1'}}
/>
</InlineBlock>
</div>
);
}
)
}
];
someReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReally.a([
[],
// comment
[],
]);
(function webpackUniversalModuleDefinition() {})(this, function(__WEBPACK_EXTERNAL_MODULE_85__, __WEBPACK_EXTERNAL_MODULE_115__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports, __webpack_require__) {
/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {
/***/ },
/* 2 */
/***/ function(module, exports, __webpack_require__) {
/***/ }
/******/ ])
});
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
var listener = DOM.listen(
introCard,
"click",
sigil,
(event: JavelinEvent): void =>
BanzaiLogger.log(config, {
...logData,
...DataStore.get(event.getNode(sigil))
})
);
a(
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong,
[
{
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong: 1
}
]
);
exports.examples = [
{
render: withGraphQLQuery(
"node(1234567890){image{uri}}",
function(container, data) {
return (
<div>
<InlineBlock>
<img
src={data[1234567890].image.uri}
style={{
position: "absolute",
top: "0",
left: "0",
zIndex: "-1"
}}
/>
</InlineBlock>
</div>
);
}
)
}
];
someReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReally.a(
[
[],
// comment
[]
]
);
(function webpackUniversalModuleDefinition() {})(
this,
function(__WEBPACK_EXTERNAL_MODULE_85__, __WEBPACK_EXTERNAL_MODULE_115__) {
return /******/ (function(modules) {
// webpackBootstrap
/******/
})(
/************************************************************************/
/******/ [
/* 0 */
/***/ function(module, exports, __webpack_require__) {
/***/
},
/* 1 */
/***/ function(module, exports, __webpack_require__) {
/***/
},
/* 2 */
/***/ function(module, exports, __webpack_require__) {
/***/
}
/******/
]
);
}
);
`;
exports[`jsx.js 1`] = `
const els = items.map(item => (
<div className="whatever">
Expand Down
66 changes: 66 additions & 0 deletions tests/last_argument_expansion/edge_case.js
@@ -0,0 +1,66 @@
var listener = DOM.listen(
introCard,
'click',
sigil,
(event: JavelinEvent): void =>
BanzaiLogger.log(
config,
{...logData, ...DataStore.get(event.getNode(sigil))},
),
);

a(
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong,
[
{
SomethingVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryVeryLong: 1
}
]
);

exports.examples = [
{
render: withGraphQLQuery(
'node(1234567890){image{uri}}',
function(container, data) {
return (
<div>
<InlineBlock>
<img
src={data[1234567890].image.uri}
style={{position: 'absolute', top: '0', left: '0', zIndex:'-1'}}
/>
</InlineBlock>
</div>
);
}
)
}
];

someReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReallyReally.a([
[],
// comment
[],
]);

(function webpackUniversalModuleDefinition() {})(this, function(__WEBPACK_EXTERNAL_MODULE_85__, __WEBPACK_EXTERNAL_MODULE_115__) {
return /******/ (function(modules) { // webpackBootstrap

/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports, __webpack_require__) {

/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {

/***/ },
/* 2 */
/***/ function(module, exports, __webpack_require__) {

/***/ }
/******/ ])
});

0 comments on commit fe7ebc0

Please sign in to comment.