fix: clarify numeric escape errors - #18421

Build successful! You can test your changes in the REPL here: https://babeljs.io/repl/build/62582

Open in StackBlitz

commit: 26d0fef

the issue wants this error message to include failing escape character. the code change adds that, as well as the position of the failing character ("detail").
existing implementation does not report the actual failing character.

I don't think this PR really fixes #13791. The culprit of #13791 is that the error is thrown in a position with large column such that the code frame does not easily fit in a small screen. This is common when passing minified source or source with large string to Babel.

To properly fix this issue, I suggest we introduce a maxWidth: number option to @babel/code-frame. maxWidth should be a positive integer, when maxWidth is set, @babel/code-frame will print a window-wrapped code frame, e.g.

/repl.js: The only valid numeric escape in strict mode is '\0'. (1:244)

> 1 | [...]\'ajS>\0~y\8PZ*|-BRY&m%U[...]
    |                 ^
  2 |

And now without the parser message change, it is very clear that \8 in the original source causes this error, such that we don't have to duplicate that information again in the parser error message. The code-frame is exactly for the purpose of locating the problematic input. With this option, we don't have to update other parser errors: since one could argument that another parser error does not contain the source and they can not view the error on their screens.

@oovz It will be a new feature for @babel/code-frame, do you want to open a PR?

@JLHwung thank you! I agree that instead of removing the position we should introduce a maxWidth (or wrapWidth) to keep the position output while fitting the terminal properly.
I'm wondering if the caller need to adjust as well to adapt with this new variable and do I need to make that change too?