Where is Electron (or Chrome) saving the zoom setting? - google-chrome

In my electron app menu I am using the built-in zoomin/zoomout roles. (The menu code being used is pasted in at the end of this question.) I start the app, choose zoom-in, then close the app. When I start it again, it starts at that already zoomed in setting.
Where is it saving this configuration? There is no hidden file being created or modified in the application directory, or below. I wondered if it might be something about my development environment, so I built the Linux package, and ran that, but the behaviour is the same.
Another question I've had is where the Chrome debugger saves the breakpoints (and other debug configuration) between runs of my electron app, and now I'm wondering if the zoom setting is also a Chrome thing? However, I've checked and it appears to be saving these settings per-application: if I set the zoom in the development environment, it has not affected the zoom when I start the packaged version.
(To be clear, this is not a bug I'm trying to fix - in fact I'd class it as a feature - but I would like to understand what setting files my Electron app is reading/writing, beyond the ones I am explicitly creating.)
{
label: 'View',
submenu: [
{role:'resetzoom'},
{role:'zoomin'},
{role:'zoomout'},
{type:'separator'},
{role:'togglefullscreen'},
]
}

Related

Electron Dialog closing refreshes my current page

I have an electron app.
It uses Bootstrap v4, Electron v2 amongst some other node modules.
I have a button which opens an electron dialog, the user selects a folder, and at this point, my application BrowserWindow appears to refresh.
I don't want this refresh to occur. I have created a test case which shows this behaviour. No doubt I have made a simple error, please can take a look at this repo to show the test case which reproduces my problem.
https://bitbucket.org/renegadeandy/electron-dialog-problem/src/master/
The problem was I am writing a log.txt file to the directory which is being watched by the electron-reload module.
When I write a new record to the log, the file changes, and causes my application to reload! Makes sense - but the combination of my logging & active reload isn't working nicely together.
I have solved it by simply removing electron-reload.

open an URL upon my extension has been installed or uninstalled

As for open an URL upon my extension has been uninstalled, I found the easiest way to do is using chrome.runtime.setUninstallURL, (1) any other good ways?
As for open an URL upon my extension has been first time installed, I don't find something like chrome.runtime.setInstallURL, I implemented the feature with
chrome.runtime.onInstalled.addListener(function(details){
if (details.reason=="install"){chrome.tabs.create({ url: homePage});}
})
I saw AdBlock opens its options page upon first time installed, but it doesn't even used chrome.runtime.onInstalled, its source code is so much complicated , I cannot figure out how it implement the feature ,(2) how it do it ? any other ways to open an URL or its options page upon the extension has been first time installed?
(3) what are the common ways to do something when an extension has been installed or uninstalled?
SetUninstallURL seems to be specifically designed for your task, so it's certainly the right way.
Regarding the installation page, not sure how AdBlock does it, but if you have a persistent background page, one of the simpler ways would be to show the page on every launch if a certain localStorage key is not set.
// background.html startup, for example DOMContentLoaded handler
if ( !localStorage.getItem('intro_shown') ) {
localStorage.setItem('intro_shown', true);
showIntroPage();
}
Local storage of the extension's background page will be persistent, apart from several corner cases (incognito mode in FF, etc).
Upd by Makyen:
chrome.storage seems to be a much better option specifically designed for extension storage needs. It could also be automatically synced with Chrome sync (using chrome.storage.sync)

Google Web Designer has a very long load time

I'm creating an html5 banner using Google Web Designer. I've created the banner and published it. When I view the published version I noticed that it takes sometime to load.
Someone else on my team is also creating HTML5 banners. The banner that he creates loads instantly even though its a larger file size. We compared our files and other than the actual assets, the way the banner was created and published is the same.
Does anyone have any ideas why this might be happening?
GWD add this code at the end of the banner and animation show up immediately:
<script data-exports-type="dclk-quick-preview">studio.Enabler.setRushSimulatedLocalEvents(true);</script>
Which environment are you using?
When creating a new project in GWD you are able to select an environment. By default is DoubleClick.
This adds additional file (in the case of DoubleClick, the Enabler library).
If you open your Chrome console, while running the banner, you will see that the banner is not initialized until the enabler is available.
You will also see how much time it takes to load the enabler.
If your colleague is creating a banner without that library, or without correctly listening to the event Enabler.initialized, this may be the main reason for the discrepancy.
If you don't want to include this additional library (that is used to integrate your banner in DoubleClick Studio), just select Generic from the environments dropdown.
There is also another reason that may cause the delay, and is the PoliteLoader.
You can select to politeLoad the banner from the Publish menu.
If the PoliteLoader is selected this cause the banner to be initialized only after the page is fully loaded. This may cause delays compared to a non polite loaded ads.
This all seems not to be a bug, but a feature of enabler.js simulates a test environment, when not beeing uploaded to Adwords (guess it similar in Doubleclick). Uploading to Google Environments should change the situation
Look at the console and see:
There is a long delay in alle items loading after the enabler.js.
It is NOT because of a long loading time of enabler.js - thats all fine.
Looking at the Logs, the enabler waits a second and throws out:
[ 1.008s] [studio.sdk] Using default ad parameters in test environment. Simulating local events.
When uploading to Google Adwords (i assume that this all is similar to DC Studio) - the enabler throws out different logs and the delay disappears.
Hope this was helpful.
By chance, I found out a way to make the Enabler loading fast. Instead of using Publish, use Preview to generate the HTML.
For some reasons, Enabler.js in preview-generated HTML only takes 0.019s to load as compared to Enabler.js in publish-generated HTML taking 1.015s to load.
Studio Enabler SDK looks for "e" parameter in iframe URL containing Studio creative. It expects a number and uses that to set the creative environment.
Setting e=1 in your preview environment (query string parameter in the iframe url pointing at the index.html for your studio creative) will tell Enabler to use LIVE mode.
I assume there is a reason why Enabler has this functionality (avoid counting impressions or paying for impressions from test/qa environment)...so I wouldn't suggest using this as a permanent setting.

Change to this file were not saved to file system error in google chrome version 30.0.1599.101 m

In the google chrome version 30.0.1599.101 m I am not able to save the changed js file.
On saving the js file I got yellow triangle symbol with "change to this file were not saved to file system" message.
I know this used to work in older version
I am using windows-7 64 bit
Click on the cog in the developer tools window (lower right corner)
Go to workspace and add the directory which you would be working on.
This is to accidentally prevent you from modifying files that you did not intend on changing.
Happened to me too. After picking the workspace directory, I also mapped the file from the "Source" panel of Devtools to its filesystem equivalent (using right-click on the file, from the file tree). It solved my problem.
In chrome > 63, accepted answer option is disabled.
In later should be done through workspaces.
Tonight, I accidentally managed to fix this problem, just open the file on the disk and save it with a simple change even with a space.
Refresh the page in Chrome, Chrome will link it(The file) to the disk.
Using Ctrl + F5 to clear the browser cache worked for me.
I found nothing in "workspace" that seemed relevant, and other things people listed didn't help either. What helped was to go in dev tools, where it says Pages, Sources etc., there is also Overrides (duh :)), I chose it, it said "Select folder for overrides", I did, and then also clicked "Allow" on Chrome asking for confirmation. That's it, after that I was able to save the files, the overrides worked.
Ok, my case might be a bit different but I will share my experience on what I was facing that caused to this warning and how I solved it.
I was trying to check a certain strange behavior on a React app for video streaming, so I opened up Developer console, enabled local overrides and tried editing the js file, immediately upon saving I got the warning “Changes to this file were not saved to file system”.
Note the message at bottom right “Source mapped from app.bundle.min.js”, this indicated that this is not an actual file but a mapping from the app.bundle.js (Webpack bundle)
So I moved to editing the app.bundle.min.js, I searched the appropriate string I was interested in from the mapped file (react-dom.production.min.js) and searched it in app.bundle.min.js
Again I got the same warning but I noticed the “app.bundle.min.js” file was fetched using a url parameter ?v=4900, I decided to remove it to check if that was the culprit causing the issue, to achieve that I modified the index.html file and edited the script tag that was fetching the js file from
<script src="libs/app.bundle.min.js?v=4900"></script> to <script src="libs/app.bundle.min.js"></script>
After that I forced refresh the page (Shift+F5, normal refresh didn’t work), tried modifying and saving and Jackpooot!! (Take away: You can’t override files fetched with a url parameter). I then was able to beautify, modify and override the app.bundle.min.js implementation and achieved what I wanted.
On Chrome Version 109~ :
Go to F12 > Sources Tab > Overrides (You may need to click the chevron next to Page)
Select/Create a folder to contain Overrides
You can now right-click a file or editor window & save it for Overrides
Image of sources tab where Overrides is located
Something to note: if you are making dynamically loaded JS available in devtools via the helpful: //# sourceURL=Example.js comment, this network to local mapping will not work.
Note: Notice the "//# sourceURL=dynamicScript.js" line at the end of dynamicScript.js file. This technique gives a name to a script created with eval, and will be discussed in more detail in the Source Maps section. Breakpoints can be set in dynamic JavaScript only if it has a user supplied name.
https://developer.chrome.com/devtools/docs/javascript-debugging
When you're using sourceURL, you can't actually find the respective JS file in the Sources tree where you might expect it to exist. It is available to open via the "no-domain" tree, however (or quick open with CTRL/CMD+P).
I'm still looking for a solution.
The easiest solution I found to this problem:
(keep in mind, I was manipulating an html page that lives on my machine)
open the associated html page from the command line so the page displays
for mac, that's simply $ open <name>.html
open Dev Tools
open Sources tab
in Page, open a new .js file there with whatever name you need
write in some text and save
This worked for me. Yes, I had to create a new .js file, but my directory locally recognized it was there when I pulled it, and my editor was updating in real time with the dev tools each time I saved either. At that point, my editor and the dev tools source tab had become one thing.
Currently on Chrome 100.0.4896.60 (Official Build) (x86_64).
I've got a js file with source maps; the override has always been spotted.
I'm able to override the map file (which won't work though for the debugging purpose) and the index.html file.
Apparently my issue is related to minified js with source maps.
Seem to work in relation to the chrome version installed.
I tried the following attempts but didn't work:
remove cache
disable / enable override
add the dir to the workspace
install chrome canary
To debug then I've tried:
build my file.min.js to test. In my case was production/file.min.js
start a npx http-server in production (cd production && npx http-server) which open to http://127.0.0.1
override index.html to consume http://127.0.0.1/file.min.js
Interesting considerations:
When i was doing basic overriding i had to replace the file manually all the times.
Now, I've got a watch task going on and i can basically refresh the page.
I can see as well the source map update.
It's simple! Right click on your page, Go to Inspect, go to the Network tab and tick the check box 'Disable cache'. Reload the page and you will see the effect.

Offline web app for distribution in pendrives (Windows only)?

We are trying to distribute a basic HTML file with some links to a PDF document in a USB drive for advertising purposes. The idea is that an autorun opens up this HTML in the default browser. However, this might not be a good idea since it would look very amateur-ish and we will have to rely on the default browser's technology (which unfortunately has a good chance on being IE6/7!)
We've explored a few alternatives, but we can't find one that really fits what we are trying to achieve:
Mozilla Prism
Altough it seems like it's designed with offline web apps in mind, the executable creates files in the user's AppData directory and it's hard to configure the default paths. Also, Firefox doesn't have a default PDF viewer, so we will have to depend on the user's default PDF viewer (which might be Adobe Reader)
Mozilla Chromeless
Since Prism is inactive, the idea is still developing with Chromeless, which allows the developer to create the browser interface with basic HTML/JS/CSS. The main issue here is that somehow the build isn't loading HTML, all that's showing is a gray iframe. I'm not sure if it's just me, because there's nothing on the issues page.
Portable App
We could throw in the portable version of Firefox or Chrome and customize the XUL for Firefox or open Chrome in app mode.
Firefox's advantage is that it kind of supports relative paths (resource://), but it doesn't have a built-in PDF viewer. Chrome has a very good and lightweight PDF viewer and the built-in app mode is a very useful feature for us, but I can't find how to open a local path without the usual absolute path (file:///C:/) since we don't know what's the drive's letter.
Has anyone figure out how to handle this kind of issues? Thanks.
This has been asked three years ago, but it's unanswered, listed high in Google, and I stumbled over the exact same problem and can imagine that many others that seek to ship portable web apps that can be run locally and with a minimum of dependencies will encounter this issue, too.
The solution I am now going with is the node-webkit.
You can treat it like a portable version of chrome, however it excepts a relative path to your app's entry point, is about 40 MB smaller, and much more customizable than the --app mode of chrome (which isn't customizable at all if I remember correctly).
Github & Download:
https://github.com/rogerwang/node-webkit#downloads
An extensive guide:
http://thejackalofjavascript.com/getting-started-with-node-webkit-apps/
My usage suggestion for Windows:
First create an app package as explained in the guide linked above
For the node-wekit to load with your app, you need to start it like this:
nw.exe app.package
Where nw.exe is in the root of the zipped folder you downloaded and app.package is a zip file (can have any name) that contains your app data and package.json.
To do this silently, you can use a BAT file containing the (amended) call above and a VBS file containing something like this:
CreateObject("Wscript.Shell").Run "cmd /c launchNW.bat", 0, true
launchNW.bat being the name of your BAT file. Now run the VBS file; a window containing your web app should pop up without the command window appearing with it.
Finish reading the linked guide to learn more about customization options to do things like hiding the browser UI etc.