Help : Workspace : local JS file mapped to network resource not working

[Ellen Zenri]

Having trouble specifically with JS files - I've been able to get expected results with CSS files.

I believe the following is working:

- adding a new folder to workspace

- map local file to network resource

- editing the js file using the Source panel

- Cmd+S after changes display "Recompliation and update succeeded in the console

Where it is not working:

- my edit is declaring a new variable (ex: var someVariable = 'hello world'; )

• Expected results: use the console to by typing "console.log(someVariable);" and for it to return "hello world"
• Actual results: use the console to by typing "console.log(someVariable);" and is returning ReferenceError: someVariable is not defined

Love love the new workspaces! Please let me know if this is a true bug or if I'm doing something wrong here! 

<3

Ellen

[Ellen Zenri]

Using 

• Chrome Canary Version 34.0.1801.0
  
• OS X Mavericks Version 10.9.1

[PhistucK]

I am not sure the JavaScript are supposed to reload automatically, I think only CSS files reload automatically.

☆PhistucK

--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/36296cb3-d97c-4e04-98a4-b973926a88f2%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

[Ellen Zenri]

Thanks for the quick reply PhistucK. Am I using Workspaces incorrectly for js? What is the expected result when mapping a local js file to a network js resource?

On Thursday, January 23, 2014 10:52:06 AM UTC-8, PhistucK wrote:

I am not sure the JavaScript are supposed to reload automatically, I think only CSS files reload automatically.

☆PhistucK

On Thu, Jan 23, 2014 at 8:46 PM, Ellen Zenri <ellen...@gmail.com> wrote:

Having trouble specifically with JS files - I've been able to get expected results with CSS files.

I believe the following is working:

- adding a new folder to workspace

- map local file to network resource

- editing the js file using the Source panel

- Cmd+S after changes display "Recompliation and update succeeded in the console

Where it is not working:

- my edit is declaring a new variable (ex: var someVariable = 'hello world'; )

• Expected results: use the console to by typing "console.log(someVariable);" and for it to return "hello world"
• Actual results: use the console to by typing "console.log(someVariable);" and is returning ReferenceError: someVariable is not defined

Love love the new workspaces! Please let me know if this is a true bug or if I'm doing something wrong here! 

<3

Ellen

--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.

To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.

[PhistucK]

I think changing the JavaScript resource will affect the stored one, but it will not reload the page automatically. You have to reload the entire page in order to see the effects of your change.

☆PhistucK

To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/dcb38ff3-c156-4cf7-abe5-a9d098a95f84%40googlegroups.com.

[Ellen Zenri]

Hmm doesn't seem to be working for me. Here is what I have tried:

- created new variable through the source panel, saved changes, closed inspector, refreshed web page, restarted inspector. results: devtool console does not recognize the variable

- removed mapped folder, reopened canary, created that new variable on my local file, then re-mapped folder, mapped new local file to the network resource. results: same as above

Btw, I've had Enabled JavaScript source maps checked in Settings > General - not sure if this info helps at this point...

If my expected result is not available yet for js it makes sense since all the videos/talks/articles only cover css examples. 

A workaround for this is to just copy+paste new js code to the console and hit enter to run it. My crystal ball says Chrome will eventually introduce a more automated way of doing this because Google rocks. I'll stick to the workaround for now :)

Thanks PhistucK!

--
You received this message because you are subscribed to a topic in the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-chrome-developer-tools/iwRF_berWMw/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CABc02_JsLb2QKOdxFrXZ8mqnzYLQg4wxwNDA6y1x2%2Byf4JNdhw%40mail.gmail.com.

[PhistucK]

Mmm... that sounds weird. It sounds like you are actually mapping the wrong files (or maybe you are using a minified version of your file, which does not automatically minify your files). If you change the local files and refresh the page (it does not matter whether you re-map your files or not) - the changes must affect the browser (barring any cache issues, of course). If they do not, you may be doing something wrong.

☆PhistucK

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CAN%3Db%2BMiz7ngsC%2BjXuN2RfJ-QovrDae6rK3NV_msU3fY7V_nRug%40mail.gmail.com.

[John J Barton]

JavaScript edits will attempt to "live edit" if you are stopped on a breakpoint. You saw "Recompliation and update succeeded" in the console, so the live-edit succeeded. Unfortunately the JS live-edit is very limited since it just updates a single function instance as far as I can tell. It is most useful if you are editing expressions in functions while on a breakpoint and checking the values within that function.

The particular scenario you outlined which fails could be caused by scope issues or issues with update.  For instance, if your code after edit looks like:

function foo() {

   var someVariable = "Hello World";

   ...

}

then console.log(someVariable) give a reference error because someVariable is only available the scope of foo(), not in the outer scope where the command line runs.

On the other hand if your variable was at the outer level:

var someVariable = "Hello World";

then the console.log() will fail because the live-edit does not re-execute the outer function.

For these reasons, you might try using live-edit while stopped on a break point. For example breaking in foo() above will allow updates to someVariable within foo().  Or just ignore live-edit and hit reload, control r.

BTW typing "console.log(...)" into the command line is not generally recommended. It just confuses the issues most of the time. If you want the value of 'someVariable', just type it in to the command line.

HTH,

jjb

On Thu, Jan 23, 2014 at 11:10 AM, PhistucK <phis...@gmail.com> wrote:

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CABc02_JsLb2QKOdxFrXZ8mqnzYLQg4wxwNDA6y1x2%2Byf4JNdhw%40mail.gmail.com.

[Ellen Zenri]

Hmm yes, very possible that this is more of an user error! I don't know how to get around it right now but I'll come back to update this post if I do figure it out. Happy Friday~!

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CABc02_JLTO8CnDLNRVvFVYs236OVjp2VkS0Unvk9h_5Z8vARBg%40mail.gmail.com.

[Ellen Zenri]

@John that is such great feedback. I didn't think about where to declare a variable (I was declaring at the outer level) and why console.log is not good to use. Love learning something new. Will try that thank you!

--
You received this message because you are subscribed to a topic in the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-chrome-developer-tools/iwRF_berWMw/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-chrome-develo...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CAFAtnWzEdvrv563ZgtbXiKY_k8CJTiH-2rLr5y5Tg-meD%3DzJTw%40mail.gmail.com.

[Ellen Zenri]

@John Hello again. Adding new script instructions inside of a existing function worked! Here is what I did:

1) Made changes to an existing function

function someExistingFunc(){

//some existing instructions 

var someVariable = 'hello world';

console.log(someVariable);

}

2) Cmd+S and confirmed that Recompilation and update succeeded appeared in the console

3) No need to refresh/reload page

4) Typed the someExistingFunc();in the console 

5) Saw expected results, which is hello world in the console 

Would be really neat if the feature worked for:

• any new instructions on the outer level (new variables, new functions)
  
• any new instructions in between the existing $(function() { ... });

☆PhistucK

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/dcb38ff3-c156-4cf7-abe5-a9d098a95f84%40googlegroups.com.

For more options, visit https://groups.google.com/groups/opt_out.

--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.

To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-chrome-developer-tools/CABc02_JsLb2QKOdxFrXZ8mqnzYLQg4wxwNDA6y1x2%2Byf4JNdhw%40mail.gmail.com.

For more options, visit https://groups.google.com/groups/opt_out.

--
You received this message because you are subscribed to a topic in the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-chrome-developer-tools/iwRF_berWMw/unsubscribe.

To unsubscribe from this group and all its topics, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.