How to use chrome breakpoint debugging tools with VueJS? - google-chrome

I develop with VIM, and I am trying to find a way to use chrome breakpoints for my frontend Vue.js app. I'm also using nuxt to develop my app with Vue.
Has anyone been able to successfully set a breakpoint in chrome without having to use vscode as their editor? If so what changes did they have to make?
For clarity's sake, I have of course tried entering debugger into my JS code, and I have also clicked on the left side of the source file in the chrome to apply a breakpoint on a particular line. Neither of these ways of applying a breakpoint have worked for me.

As I know There 2 way to use break point in these framework :
First, add debugger; in your code where you want like below:
methods: {
test() {
let x = 15 * 5
debugger
//// other code
}
},
Second, open developer mode in source file found the place you want to have break point and click left side of it :)

Related

Modify the guiviewer3d-toolbar

I would like hide everything in the toolbar except the measureTools, which I managed to do using visibility: hidden for all of the other tools.
However, the dark background theme is still visible for all three tool-groups (navTools, modelTools, settingsTools).
Everything disappears if I set
.dark-theme{
visibility: hidden;
{
And if I modify the .dark theme{ background-color: rgba(34,34,34,.0);} it effects the expanded options that shows when the measure tool is clicked.
Any suggestion? Thanks a bunch.
Why not, better use the Headless viewer and add a Custom button that access the Autodesk.Measure Extension? By a headless viewer you can refer to this sample
https://viewer-rocks.autodesk.io/
That one is using custom made extensions that become available when you make the viewer go on full screen mode.
---- EDIT
Is this what you are trying to achieve? Only Measure Tool showing
Here also is how it looks when you try to use it.
If this is what you want, you can try using an extension we have called Control Selector, play with the extension and see how it works.
A live link that uses the extension can be found here.
https://viewer-nodejs-tutorial.herokuapp.com/
And here you can find the Code for the extension, just bare in mind that the extensions were written with ES6 sytanx, so it needs transpiling before it can be used.
https://github.com/Autodesk-Forge/library-javascript-viewer-extensions/blob/master/src/Autodesk.ADN.Viewing.Extension.ControlSelector/Autodesk.ADN.Viewing.Extension.ControlSelector.js

Add space in the bottom of chrome dev console

Each Time I'm using this console I'm struggeling with my mouse to click on the editable line.
So two question :
Is there a way of enlarging this line so it easier to click on it ?
Is there a command to navigate to it ?
The only way to enlarge it is to create a custom theme for DevTools, enable the experiment for using custom themes, and then installing your extension. That way you can get custom CSS into the top-level DevTools scope to modify things.
You may open a bug report on the chromium issue tracker against the DevTools so the team can assess the UX to see if there is anything they should modify internally.

Nightwatch switchWindow() not working in Google Chrome

I have a test that cause a new window to open that contains a form to fill out. In FireFox it works to switch to this window using browser.switchWindow(windowName), but in Chrome it does not seem to switch to the window as it is then unable to find the form to fill out in the new window.
Anyone run into anything like this and have a possible solution? Thanks!
Edit:
This is a small code snippet I found showing what I did.
browser
.click('selector') // Button click to open new window
.pause(1000)
.switchWindow('newWindowID')
I got it to work, for me it was as simple as putting a short pause() before trying to switchWindow(). It seems it tried to switch to the new window before it actually opened.
I can't leave a comment because of not a high enough reputation, but I was wondering if you could show your code for the solution to this. I am trying to figure out how to get this same scenario to work, and am stumped. Thanks
if it is not working for some of you, specially in mac machine then try below thing :
Starting with version 75, Chromedriver has W3C Webdriver protocol enabled by default. If you'd like to stick to the JSONWire for now adjust the chromeOptions:
chromeOptions: {
w3c: false
}
into nightwatch.json file

Is there an alternative to watir::ie.attach for watir-webdriver since attach is not supported on webdriver

I have a website which is only rendered in Webkit enabled browser (Google Chrome, Safari). I am using Google Chrome since I am on Windows 7.
I am using Watir-WebDriver to automate the same.
Issue: When I click on a button on the browser window, is launches another window and post click content is rendered in the new browser window. I need a way to be able to Identify this new browser window, in-order to be able to proceed with my testing. I have been reading on various forums, but not getting any certain answer/solution.
Q: Is there an alternative to watir::ie.attach for watir-webdriver since attach is not supported on Watir-Webdriver
Sample code:
require "rubygems"
require "watir-webdriver"
require "selenium-webdriver"
b = Watir::Browser.new(:chrome)
website = "http://xyz.com"
#a new browser is launched and the website is opened
b.goto(website)
#this opens a new browser window
b.link(:xpath,"/html/body/div/ul/li/a").click
#there is a button called "MAP" on the new browser window
b.link(:id,"btn_MAP")
#this gives an error, unknown link
"window" method is the alternative for ie.attach. Webdriver can handle the window opened by itself with window method.
b.link(:href,/server\/getPage/).click
b.window(:url,/server\/getPage/i).use do
b.link(:id,"btn_MAP").click
end
you can handle popped up windows in the window method block. If you want to keep handling popped up window, use it without block, like window(:url,/foobar/).use
see also:
http://groups.google.com/group/watir-general/browse_thread/thread/232df221602d4cfb
#Yutaka: Thanks a lot for all your help it lead me to use something like the following and it worked!
b.link(:xpath,"/html/body/div/ul/li/a").click
c = b.window(:url,"http:\/\/server\/getPage\/67\/1354")
c.use
b.link(:id,"btn_MAP").click
have you tried making the website the default homepage for the browser?
that might prevent you from having to do an attach.

Creating Chrome popup with a C++ program

Problem context:
I have a C++ program and a web presence. Currently the way things are working I have made a control panel with javascript and html. And it send commands via an unimportant communication medium to control things or get information from the C++ program.
Now, when the C++ program launches, I'm making it run a
ShellExecute(NULL, "open", addressBuffer," --new-window", NULL, SW_NORMAL);
This is a way of launching the default browser with the given address. The addressBuffer in this case points to an intermediate HTML file that quickly turns around and uses the
window.open()
in Javascript to open the final popup, then closes itself.
The result is the user now has the popup control panel that I want them to have but the user's main browser window also gets given focus, un-minimized, and placed on a different tab than the one they had selected. (Basically pops up out of nowhere and selects a another tab)
Problem:
I'm looking for a way to launch a Chrome popup, without disturbing a previously open browser window. Any ideas or solutions would be very helpful.
Lastly, it's worth noting that the " --new-window" from the code above doesn't actually open a new window like you would expect. In this case it's actually doing nothing... If it did work, none of this would really be an issue.
I know this is wordy so thanks in advance for you time!
-Michael
Alright, I came up with a solution.
Something about how ShellExecute processes it's commands was preventing the command line args to be passed in correctly.
My work-around includes grabbing the path to Chrome from the registry,
HKET_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\App Paths\chrome.exe
Then simply doing a system() command with the chrome path "--new-window" and the web path.
Then I let the intermediate html page open it's popup and close itself.
Tada done.
Thanks.