Chrome SASS source maps with SASS files not publicly accessible - google-chrome

I'm having the following issues on a project I'm working on. We've set it up so that source assets (scss files, etc) are not publicly accessible. I'm compiling the files into a publicly accessible directory along with the source map file.
Is there anyway to allow chrome to access these source files so that I can view sourcemap info? I'm working locally.

For source maps to work you need to be accessing your site/app from a server. View your project on your favorite flavor or LAMP/XAMPP/WAMP or other local server configuration.
Source

Related

Index.html/index.php not found in Google CodeLabs app shell

I was interested on on Google's web app-Shell. I've downloaded it GitHub. But I found that there is no index.html/index.php file in the whole code. All I mainly found, is the licence file, app.yaml file and app.js file. Link to that page, is here.
I heard,that I can install the project in my web hosting site, by using terminal. But terminal is not an option for my situation. I've stopped using Firebase, because I must have terminal for it. So, is there any other idea to install the project in my website?
Can I have a flat file, so that I could simply past the html,css, JavaScript and other media files into my server?
Unfortunately the Google web app-Shell isn't designed to have an index.html file. There is a views folder that has what you're looking for https://github.com/GoogleChromeLabs/application-shell/tree/master/server/views.
As we can see they're using handlebars for as a templating system. For example, if we look at https://github.com/GoogleChromeLabs/application-shell/blob/master/server/views/layouts/default.handlebars we can see that they have {{> open-page}} and {{{body}}}. If we look at handlebars documentation these partials are rendered into other views.
Essentially, there isn't a single index.html we can point to, but we can reconstruct the app by exploring their views.

How to explore Google Endpoint API hosted over HTTP without generating google chrome files in my project folder?

I am testing my Google Endpoint API over localhost. And to test the api locally, I am following this command suggested from google- (https://developers.google.com/explorer-help/#hitting_local_api)
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir="C:\Users\Probhat\workspace\codesap" --unsafely-treat-insecure-origin-as-secure=http://localhost:8888
It is working fine. I can access the API's. But the main problem here is that the command itself generating some extra files in my project folder. And the files are very irritating while developing the project.
Earlier I can easily load the api's just clicking "Load Unsafe Scripts". It did not generate the chrome files. But this is not working now.
I want to know is there any way to test the API's in Chrome without generating those files?

Chrome Dev Tools - Workspace mapping mismatch

I have a remote webpage that loads a remote JavaScript file called script.js. I don't have immediate access to the remote filesystem to make changes to test something.
So I copy script.js to my local drive, and in Chrome Dev Tools I add my local folder to the workspace. Then I right-click on my remote script.js file and pick Map to File System Resource.... I pick my local script.js.
So now I would expect my locale changes to script.js to override the remote script.js, right? This way I can make some changes to my local script.js and when I reload the page I can see the changes being reflected on my page.
However in the Sources tab, when selecting my local script.js I see the warning at the top:
Workspace mapping mismatch
The content of this file on the file system:
file:///Users/me/test/script.js
does not match the loaded script:
http://someserver.com/js/script.js
Possible solutions are:
- Reload inspected page
- Check that your file and script are both loaded from the correct source and their contents match
So is this telling me that my local script.js needs to be exactly the same as the remote script.js? If so, then what is the point of the local resource?
Isn't it there so that you can make changes to it and see those changes reflected in the browser? If it has to match the remote file, then you must already have access to be able to edit the remote file, in which case you would be making your changes there and not on the local file. If that is the case, then what is the point of having the local resource mapped?
Am I missing something here? Is it not possible to make temporary local changes to a file in Chrome Dev Tools and have those changes be reflected when the page is reloaded? I thought that was the purpose of the Local File System Resources.
Workspaces is built to map the same file that's in file and served over the network. (like serving ~/code/app to localhost:8000).
It will not work for serving a local file as a replacement. There are some Chrome extensions for this, I recommend Flip the Script.

Openshift: where to put resource files that I want outside of the deployment folder

I'm starting a new web app with Openshift (jboss, mysql). It's the first time I use openshift and after reading through some doc and experimenting a bit with it, I'm having one question regarding best practices for the architecture of my app.
There will be some files generated by- or uploaded to the application (resources). I'd like those files to be outside the deployment folder so they are not erased/overwritten when the app deploys again. I have browsed through the directories and I was wondering:
is it ok to use the /var/lib/openshift/[openshift-id]/app-root/data folder for these files?
Yes, you should use your ~/app-root/data folder for any files that you want to not be erased when you do a git push, there is also an environment variable that you can use that points to that folder called OPENSHIFT_DATA_DIR. Please note that if you are using a scaled application, that folder is not shared among your gears.

HTML5 and filesystem management

I have a directory with files and I want to search into that directory for some files types.
Is it possible to do that with the new file-system API?
No, You are restricted to a sand-boxed directory client side directory within the AppData for your web-browswer.
With Chrome and windows 7 for example:
C:\Users\{user}\AppData\Local\Google\Chrome\{browswer-user}\Default\File System\
Also, you can only access files/directories you've generated and populated via API calls.