Bug 153726 - Web Inspector: CodeMirror converts tabs to 4 spaces, messes up indentation on save
Summary: Web Inspector: CodeMirror converts tabs to 4 spaces, messes up indentation on...
Status: RESOLVED DUPLICATE of bug 161159
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: WebKit Nightly Build
Hardware: All All
: P2 Normal
Assignee: Nobody
Keywords: InRadar
Depends on:
Reported: 2016-01-30 22:26 PST by Nikita Vasilyev
Modified: 2016-08-24 22:44 PDT (History)
7 users (show)

See Also:

[Animated GIF] Bug (280.40 KB, image/gif)
2016-01-30 22:26 PST, Nikita Vasilyev
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Nikita Vasilyev 2016-01-30 22:26:05 PST
Created attachment 270338 [details]
[Animated GIF] Bug

See the attached GIF.

1. Open http://nv.github.io/webkit-inspector-bugs/css-saving-indentation/
2. Open style.css in Resources

Tab characters that are used for indentation are preserved as tabs.

Tab characters were replaced with four spaces.
As a result of that, editing CSS messes up with indentation.
Comment 1 Radar WebKit Bug Importer 2016-01-30 22:26:18 PST
Comment 2 Nikita Vasilyev 2016-08-23 16:17:56 PDT
This should have tests, I don't see any in LayoutTests/inspector/css.
Comment 3 Devin Rousso 2016-08-24 19:00:45 PDT
I tried messing around with changing the default keymap of "Enter" to be something like:

"Enter": (codeMirror) => {
    let doc = codeMirror.getDoc();
    doc.replaceRange("\n", doc.getCursor());
    codeMirror.indentLine(doc.getCursor().line, "prev");

This will create the newline at the expected place, but it doesn't seem to want to indent it based on the previous line.  Another "hacky" option would be to toggle `indentWithTabs` based on the number of tab characters in the editor:

let tabs = codeMirror.getValue().match(/\n\t+/g);
codeMirror.setOption("indentWithTabs", tabs && tabs.length >= codeMirror.lineCount() / 2);

I think the first option is better, but it also isn't perfect as it bases the indentation solely on the previous line, meaning that if a single line uses tabs instead of spaces, all newlines off of that line will have tabs too.
Comment 4 Nikita Vasilyev 2016-08-24 22:44:18 PDT
The actual problem here is:
Web Inspector: Minification detection produces false positives for small resources

In the animated GIF you can see that pretty printing is on, even though it shouldn't be enabled by default. When it's on, tabs are replaced by 4 spaces.

When pretty printing is off, tab characters get preserved as expected.

*** This bug has been marked as a duplicate of bug 161159 ***