Skip to content

Added groupCollapsed polyfill - #21457

Closed
Eyesonly88 wants to merge 2 commits into
react:masterfrom
Connected-Journeys:master
Closed

Eyesonly88 wants to merge 2 commits into
react:masterfrom
Connected-Journeys:master

Conversation

@Eyesonly88

Copy link
Copy Markdown
Contributor

groupCollapsed is used to group logs but collapsed which is very useful when the console has many logs (e.g. when using redux-logger).

For developers who prefer to debug iOS apps using Safari JSC, the groupCollapsed was not polyfilled.

Fixes #21446

Test Plan:

I tested it in the Safari Developer console.

Input:

console.groupCollapsed('Hello RN')
console.log('some data', {hello: "world"})
console.log('another line')
console.log('and another one')
console.groupEnd()

Output:
A single collapsed log containing the other logs as expected. See demo below.

Demo:

groupcollapsed_demo

Release Notes:

[GENERAL] [ENHANCEMENT] [JSC] - Added groupCollapsed to the console polyfill to enable log collapsing in consoles such as Safari

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Oct 3, 2018

@analysis-bot analysis-bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code analysis results:

  • eslint found some issues.

Comment thread Libraries/polyfills/console.js Outdated
groupStack.push(GROUP_PAD);
}


Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

prettier/prettier: Delete ⏎

table: consoleTablePolyfill,
group: consoleGroupPolyfill,
groupEnd: consoleGroupEndPolyfill,
groupCollapsed: consoleGroupCollapsedPolyfill,

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this should be the consoleGroupPolyfill. I believe console.groupCollapsed should behave the same as console.group in a non-debugger environment logging to the OS.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @newyankeecodeshop if I use consoleGroupPolyfill then the log won't be collapsed because of GROUP_OPEN inside consoleGroupPolyfill.

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Eyesonly88 I don't understand how the GROUP_OPEN character vs. GROUP_CLOSE makes a difference about whether the group is shown collapsed. When you attach the Safari debugger to the JSContext, is it still using the console polyfill?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@newyankeecodeshop Yes it is using the console polyfill. Without my code, there is no groupCollapsed. As you can see in the demo, using GROUP_CLOSE makes it collapsed.

@koenpunt koenpunt Dec 23, 2018 •

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

groupCollapsed isn't there because the console object in the JSC is not the original console object. The original one is called after using a polyfill method;

https://github.com/facebook/react-native/blob/3592122af3856ac58273dfeeeac59f6439fb93ef/Libraries/polyfills/console.js#L541-L549

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exactly.

@facebook-github-bot facebook-github-bot added the Import Started This pull request has been imported. This does not imply the PR has been approved. label Jan 22, 2019

@facebook-github-bot facebook-github-bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@cpojer is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

@cpojer

cpojer commented Jan 22, 2019

Copy link
Copy Markdown
Contributor

Thanks for the PR. Seems like it previously fell through the radar. Sorry about that!

@facebook-github-bot facebook-github-bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@cpojer is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

@react-native-bot

Copy link
Copy Markdown
Collaborator

@Eyesonly88 merged commit 638d672 into facebook:master.

@react react locked as resolved and limited conversation to collaborators Jan 22, 2019
@react-native-bot react-native-bot added the Merged This PR has been merged. label Jan 22, 2019
@hramos hramos removed Import Started This pull request has been imported. This does not imply the PR has been approved. labels Feb 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

8 participants