New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 828588 link

Starred by 1 user

Issue metadata

Status: WontFix
Owner:
Last visit 28 days ago
Closed: Dec 12
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug



Sign in to add a comment

DevTools Cannot Find .sass Files In Subdirectory

Reported by greg.sto...@gmail.com, Apr 3 2018

Issue description

DevTools failed to link network resource to filesystem.

Platform: Windows
Chrome version: 65

I am using @import in my main .scss file to import several other .scss files that are contained in a subdirectory, for example: @import 'css/navigation';

But when I look in the DevTools, it only lists the main .scss file with a line number that seems to reflect the compiled version, rather than listing the actual .scss file containing the code. I've reviewed my .map file and it lists all of the .scss files. I also have a Workspace enabled for that file, but when I edit the CSS in DevTools it saves the change to the compiled .css version of the main stylesheet, not in the appropriate .scss file.

In short, DevTools isn't finding the imported .scss files in the subdirectory, so although it's correctly rendering the webpage, I cannot figure out what file contains the CSS code in DevTools, nor is it saving to that file when I make edits.
 

Comment 1 by l...@chromium.org, Apr 4 2018

Owner: lushnikov@chromium.org
Status: Assigned (was: Unconfirmed)
UPDATE: For some reason it has suddenly started working and now shows the correct .scss files in the Elements tab. I'm afraid I have no idea why -- I didn't change anything, close the browser, or anything else that might have triggered it to work. 

However, it still seems buggy in other ways, for example: Changes that I make in the Elements tab get saved to the .css file, whereas changes that I make in the Sources tab get saved to the .scss file (as expected). 

Additionally, my media queries are showing up just fine in the Elements tab, but not when viewing the .scss file in the Sources tab. I made a change in the Sources tab and saved it, thinking perhaps the media queries weren't showing up because they didn't apply at my current browser window size, only to discover that it had erased all of the media queries and saved that version without them over the original file. Fortunately I was able to reverse it with Git, but for the time being I will have to keep in mind that the file as viewed in the Sources tab may not be accurate, and that saving there will save that version over the original with no way to reverse it.

So the bugs aren't consistent but many come and go.

Status: WontFix (was: Assigned)
> However, it still seems buggy in other ways, for example: Changes that I make in the Elements tab get saved to the .css file, whereas changes that I make in the Sources tab get saved to the .scss file (as expected). 

That happens because Elements panel only works with rendering engine - and rendering engine operates in terms of CSS rather than SCSS. That's why page live-updates once things get edited in elements panel.

On the contrary, Sources panel works with Project Sources. There's no live-update, but it let's you edit what you actually have on disk.

Hope this helps.

Sign in to add a comment