I have the following JavaScript files (in Vue, if that matters):
VW.js
let vw = {
vwstring: 'vwstring'
}
export default vw
Item.js
import vw from 'VW'
export default class Item {
constructor(name, type = 'generic', icon = null)
{
console.log(vw)
// Breakpoint in DevTools here. vw outputs fine but I can't find it in the DevTools scopes. Where is it??
}
}
At the above breakpoint I try to find vw under 'Scope' in Chrome DevTools, but can't - where'd it be? I've expanded a bunch of the tree under scope and ctrl-Fed it to no avail. (I can't practically expand everything because there's a lot there, being Vue.)
Related
TLDR: How can I get a reference to the textarea HTML element within the linting onUpdateLinting function.
Long version: CodeMirror has a lint option which allows the setting of a function to be called when linting is complete. I want to use this to update an HTML element to show the number of errors in the code in the codeMirror instance. Because my page might have multiple codeMirror instances - think of tabs with codeMirrors on them - my approach is to discover the textarea then from that get the appropriate display element to show the error count on the tab.
However, I cannot find how to get that textarea reference from within the onUpdateLinting function.
My onUpdateLinting function is:
lint: {
onUpdateLinting: function onUpdateLinting(annotationsNotSorted, annotations, cm) {
let errCnt = annotationsNotSorted.length;
console.log(errCnt + " errors");
let textArea = cm.getTextArea(); // << fails with cm.getTextArea is not a function
}
Which throws error 'cm.getTextArea is not a function'.
I note that if I use getTextArea when I am creating the codeMirror instance then that does not throw the error.
My conclusion is that the cm being passed into the onUpdateLinting callback is not the 'proper' codeMirror instance.
However, the codeMirror docs (screengrab below) days that the
I found that on the first callback of the onUpdateLinting the cm parameter is undefined. I guess what is happening is that the codeMirror instance is not yet defined to the linter when the linter fires up. The answer was then to check the cm reference before using it.
lint: {
onUpdateLinting: function onUpdateLinting(annotationsNotSorted, annotations, cm) {
let errCnt = annotationsNotSorted.length;
console.log(errCnt + " errors");
if (cm.getTextArea){
let textArea = cm.getTextArea();
// code to find and set the display element.
}
}
However, this left me with the situation that the error count was not updated when the codeMirror was first set up. The answer was to move the config of the lint option out of the config object and into a call to setOption, so the code became:
let myCodeMirror = CodeMirror.fromTextArea(myTextArea, {..setup options NOT including lint..})
myCodeMirror.setOption("lint", {
onUpdateLinting: function onUpdateLinting(annotationsNotSorted, annotations, cm) {
let errCnt = annotationsNotSorted.length;
console.log(errCnt + " errors");
if (cm.getTextArea){
let textArea = cm.getTextArea();
// code to find and set the display element.
}
},
esversion: 6,// use this instead of plain 'true' to allow ES6 code such as 'const' and 'let' to pass without erroneous complaints from linter.
undef: true, // linter config option
unused: true // linter config option
});
Summary - the codeMirror instance is instantiated without the lint option, then when the setOption() call is made for the lint, the linter runs causing the callback function to fire and I get the first-time-thru affect that I need to show any errors when the code is loaded.
I apologize for the slightly vague title, I'm not sure how exactly to word this.
I have my Page Object which, with one exception, works perfectly. Here's the excerpt:
module.exports = function(){
this.facilityList = element(by.name('facility')).all(by.tagName('option'));
this.randomFacility = element(by.name('facility')).all(by.tagName('option')).count().then(function(numberOfItems) {
var rnum = parseInt(Math.random() * numberOfItems);
return rnum;
}).then(function(randomNumber) {
element(by.name('facility')).all(by.tagName('option')).get(randomNumber)
});
}
I can access and use facilityList just fine. But then I realized that I'm almost always doing the same thing to facilityList so why don't I just create another line to make it choose a random one. So I create randomFacility using the code from the main conf.js.
It didn't work. The error I see displayed is:
Failed: Error while waiting for Protractor to sync with the page: "both angularJS testability and angular testability are undefined. This could be either because this is a non-angular page or because your test involves client-side navigation, which can interfere with Protractor's bootstrapping. See http://git.io/v4gXM for details"
I'm confused. Is this saying I can't do all that processing in the page object to get the random one or do I simply have to manipulate facilityList in the conf.js and be done with it?
You nee to know the mechanism about how protractor to find element. Protractor only to start find element from page when protractor's action API be called, like getText(), click(), count() etc.
So when you define variable to represent certain element on page, when Nodejs execute this line, protractor won't to start find element from page:
// page object login.page.js
module.exports = function LoginPage(){
this.sumbitButton = element(by.css('#submit'));
this.countName = element.all(by.css('.username')).count();
}
// use page object in conf.js
var LoginPage = require('./login.page.js');
var loginPage = new Loginpage();
When Nodejs execute line var loginPage = new Loginpage();, all lines in function LoginPage will be executed.
When execute the first line, protractor not to find element from current open page,
When execute the second line, protractor will find element from current open page, But at this time point, protractor is possible to launching browser with a blank page, the target page have not been opened or navigated to.
To fix your problem, you need to define randomFacility as class's Method, rather than Property:
module.exports = function() {
this.facilityList = element(by.name('facility')).all(by.tagName('option'));
this.randomFacility = function() {
return element(by.name('facility'))
.all(by.tagName('option')).count()
.then(function(numberOfItems) {
console.log('count: '+numberOfItems);
var rnum = parseInt(Math.random() * numberOfItems);
console.log('random index: '+rnum);
return rnum;
})
.then(function(randomNumber) {
console.log('argument randomNumber: '+randomNumber);
return element(by.name('facility'))
.all(by.tagName('option')).get(randomNumber)
});
}
};
// how to use
pageObject.randomFacility().then(function(ele){
return ele.click();
});
I am using visual studio code v1.17 and I am doing development in pure javascript for chrome extension development. Visual studio code v1.17 supports region folding facility for javascript and several other languages.
So, I created one class inside one .js file and write getter setter methods inside it. like
//#region EmailObj
get EmailObj() {
this._EmailObj = localStorage.getItem("CurrentEmail");
try {
this._EmailObj = JSON.parse(this._EmailObj);
}
catch(e) {
this._EmailObj = null;
}
return this._EmailObj;
}
set EmailObj(newValue) {
this._EmailObj = JSON.stringify(newValue);
localStorage.setItem("CurrentEmail", this._EmailObj)
}
remove_EmailObj() {
this._EmailObj = null;
localStorage.removeItem("CurrentEmail");
}
//#endregion EmailObj
Now as per documentation stated at https://code.visualstudio.com/updates/v1_17#_folding-regions. Plus (+) icon should be shown near #region and #endregion sections (so, I can show / hide particular region) but it is not showing there.
So, somebody help me that what I am missing here?
I updated VS code to 1.17.2 and its now working at my side.
Are there any shortcut for browsing in chrome?Or if there any software could help set shortcuts by ourselves.
Pushing the Chrome entry in the browser dropdown will open Chrome instead of IE. Surprisingly, there's presently no public way of changing the default browser, although I'm guessing that Telerik will fix this eventually.
If this is a big problem for you, you could use the BindUIButton attribute on a FiddlerScript method to add a new toolbar button that does just that. Or you can create a QuickLink menu with the commands of your choice, e.g.
QuickLinkMenu("&Browse")
QuickLinkItem("&IE", "iexplore.exe")
QuickLinkItem("&Firefox", "firefox.exe")
QuickLinkItem("&Opera", "Opera.exe")
QuickLinkItem("&Chrome", "Chrome.exe")
public static function DoBrowsersMenu(sText: String, sAction: String)
{
var oS = FiddlerApplication.UI.GetSelectedSessions();
var sURL = String.Empty;
if (oS.Length > 0) { sURL = oS[0].fullUrl; }
System.Diagnostics.Process.Start(sAction, sURL);
}
I'd like to have a GtkAppChooserButton which allows the user to select a program to run which will most likely want to be an audio mixer such as pavucontrol. Despite vague documentation on the matter I gather the app chooser's content type is meant to be a MIME type, however I cannot find a suitable MIME type for an audio mixer, or more generally just "all applications".
Some types such as application/ will give two Other Application... options if Other... items are enabled, both of which are identical and neither of which contain half the applications I have, including any audio mixers. Aside from that, nothing else I do gets me remotely close to what I'm after.
Is there a MIME type and/or GtkAppChooser content type (they seem to be the same thing?) for audio mixers or just all programs in general? (I.e. Any program that would have an icon in the likes of the Gnome app launcher/xfce4-whisker-menu/etc.)
Alright so I've come up with a solution, thought it may not be as clean as you hoped.
This thread mentioned a way to get the GtkAppChooser to "show all", but it doesn't actually show all applications you have installed. However from that I was able to work out how the GtkAppChooser is using Gio.AppInfo, which has Gio.AppInfo.get_all() (this is for PyObject) which returns a full list of Gio.AppInfos for all applications I have installed, provided they have a .desktop file.
So, my "solution" is to write my own app chooser which gets a list of apps from Gio.AppInfo.get_all().
I've cleaned up my previous solution to this and written a class 'AllAppChooser' to inherrit Gtk.Dialog, giving much greater customisation. The completed dialog looks like so:
And the code used:
import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk, Gio
class AllAppChooser(Gtk.Dialog):
"""Provide a dialog to select an app from all those installed.
The regular Gtk.AppChooserDialog does not seem to provide any way to allow
selection from all installed apps, so this dialog serves as a replacement.
"""
def __init__(self, parent=None):
super().__init__(self)
self.set_default_size(350, 400)
self.set_icon_name('gtk-search')
self.set_title('App Chooser')
if parent:
self.set_parent(parent)
self.content_box = self.get_content_area()
self.content_box.set_margin_left(8)
self.content_box.set_margin_right(8)
self.content_box.set_margin_top(8)
self.content_box.set_margin_bottom(8)
self.content_box.set_spacing(8)
self.button_box = self.get_action_area()
self.button_box.set_margin_left(4)
self.button_box.set_margin_right(4)
self.button_box.set_margin_top(4)
self.button_box.set_margin_bottom(4)
self.label = Gtk.Label('Choose An Application')
self.content_box.pack_start(self.label, False, False, 0)
self.list_store = Gtk.ListStore(str, str, int)
pixbuf_renderer = Gtk.CellRendererPixbuf()
text_renderer = Gtk.CellRendererText()
icon_column = Gtk.TreeViewColumn('icon', pixbuf_renderer, icon_name=1)
text_column = Gtk.TreeViewColumn('text', text_renderer, text=0)
self.tree_view = Gtk.TreeView()
self.tree_view.set_model(self.list_store)
self.tree_view.set_headers_visible(False)
self.tree_view.append_column(icon_column)
self.tree_view.append_column(text_column)
self.view_port = Gtk.Viewport()
self.view_port.add(self.tree_view)
self.scroll_window = Gtk.ScrolledWindow()
self.scroll_window.add(self.view_port)
self.content_box.pack_start(self.scroll_window, True, True, 0)
self.ok_button = self.add_button(Gtk.STOCK_OK, 1)
self.ok_button.connect('clicked', self.on_ok)
self.cancel_button = self.add_button(Gtk.STOCK_CANCEL, 0)
self.selected_app = None
self.app_list = []
def populate_app_list(self):
"""Populate the list of apps with all installed apps.
Icons are provided by icon-name, however some apps may return a full
path to a custom icon rather than a themed-icon name, or even no name
at all. In these cases the generic 'gtk-missing-icon' icon is used.
"""
self.app_list = Gio.AppInfo.get_all()
for i in range(len(self.app_list)):
gio_icon = self.app_list[i].get_icon()
app_icon = 'gtk-missing-icon'
if gio_icon:
app_icon = gio_icon.to_string()
app_name = self.app_list[i].get_display_name()
self.list_store.append([app_name, app_icon, i])
self.list_store.set_sort_column_id(0, Gtk.SortType.ASCENDING)
def run(self):
"""Run the dialog to get a selected app."""
self.populate_app_list()
self.show_all()
super().run()
self.destroy()
return self.selected_app
def set_label(self, text):
"""Set the label text, \"Choose An App\" by default."""
self.label.set_text(text)
def on_ok(self, button):
"""Get Gio.AppInfo of selected app when user presses OK."""
selection = self.tree_view.get_selection()
tree_model, tree_iter = selection.get_selected()
app_index = tree_model.get_value(tree_iter, 2)
self.selected_app = self.app_list[app_index]
This is then run similar to a regular dialog:
app_chooser = AllAppChooser()
application = app_chooser.run()
If the user exits the dialog box or presses cancel then the result will be None, but if they selected an application then run() will return a Gio.AppInfo object for the application which you can then do with as you please. For example, to launch your newly selected application:
application.launch()
I feel this is now a relatively solid solution, but I still welcome additional suggestions. Additionally, if there is a way to do this in Gtk without having to do all this stuff I would still love to hear it.