How can I replace the popup window with an other page in chrome extension?
I created an extension what is working in Firefox.
I changed it for Google Chrome, but it is not working.
When I click on the extension's icon then popup shown with two menu option.
But when I click on any of these links nothing happened. If I press right click on any of these links and choose open in new tab then this html file shown in a new tab. If I click on links in this new tab php file will be open and works, so I think window.location.replace does not work in crome extension.
Do anybody have any idea, how can I resolve this problem?
manifest.json
{
"browser_action": {
"default_icon": {
"48": "images/startlapom-48.png",
"96": "images/startlapom-96.png"
},
"browser_style": true,
"default_title": "Startlapom",
"default_popup": "managestartlapom.html"
},
"description": "Oldal hozzáadása, levétele a Startlapom oldalam(ra/ról)",
"manifest_version": 2,
"name": "Startlapom",
"permissions": ["tabs"],
"version": "1.0"
}
managestartlapom.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Startlapom</title>
<link rel="stylesheet" href="managestartlapom.css"/>
<link rel="stylesheet" href="https://startlapom.eu/startlapom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body class="addon-body">
<div id="startlapom-addon">
<div class="panel">
<a class="addon-link" href="#" id="startlapom-add">Oldal hozzáadása a Startlapomhoz</a><br />
<div class="panel-section-separator"></div>
<a class="addon-link" href="#" id="startlapom-remove">Oldal levétele a Startlapomról</a><br />
</div>
</div>
<script src="managestartlapom.js"></script>
</body>
</html>
managestartlapom.js
document.getElementById('startlapom-add').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=ADD');
});
}
document.getElementById('startlapom-remove').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=REM');
});
}
javascript
google-chrome-extension asked Nov 26 '18 at 21:16
horikahorika
1
add a comment |
I created an extension what is working in Firefox.
I changed it for Google Chrome, but it is not working.
When I click on the extension's icon then popup shown with two menu option.
But when I click on any of these links nothing happened. If I press right click on any of these links and choose open in new tab then this html file shown in a new tab. If I click on links in this new tab php file will be open and works, so I think window.location.replace does not work in crome extension.
Do anybody have any idea, how can I resolve this problem?
manifest.json
{
"browser_action": {
"default_icon": {
"48": "images/startlapom-48.png",
"96": "images/startlapom-96.png"
},
"browser_style": true,
"default_title": "Startlapom",
"default_popup": "managestartlapom.html"
},
"description": "Oldal hozzáadása, levétele a Startlapom oldalam(ra/ról)",
"manifest_version": 2,
"name": "Startlapom",
"permissions": ["tabs"],
"version": "1.0"
}
managestartlapom.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Startlapom</title>
<link rel="stylesheet" href="managestartlapom.css"/>
<link rel="stylesheet" href="https://startlapom.eu/startlapom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body class="addon-body">
<div id="startlapom-addon">
<div class="panel">
<a class="addon-link" href="#" id="startlapom-add">Oldal hozzáadása a Startlapomhoz</a><br />
<div class="panel-section-separator"></div>
<a class="addon-link" href="#" id="startlapom-remove">Oldal levétele a Startlapomról</a><br />
</div>
</div>
<script src="managestartlapom.js"></script>
</body>
</html>
managestartlapom.js
document.getElementById('startlapom-add').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=ADD');
});
}
document.getElementById('startlapom-remove').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=REM');
});
}
javascript
google-chrome-extension asked Nov 26 '18 at 21:16
horikahorika
1
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48
add a comment |
I created an extension what is working in Firefox.
I changed it for Google Chrome, but it is not working.
When I click on the extension's icon then popup shown with two menu option.
But when I click on any of these links nothing happened. If I press right click on any of these links and choose open in new tab then this html file shown in a new tab. If I click on links in this new tab php file will be open and works, so I think window.location.replace does not work in crome extension.
Do anybody have any idea, how can I resolve this problem?
manifest.json
{
"browser_action": {
"default_icon": {
"48": "images/startlapom-48.png",
"96": "images/startlapom-96.png"
},
"browser_style": true,
"default_title": "Startlapom",
"default_popup": "managestartlapom.html"
},
"description": "Oldal hozzáadása, levétele a Startlapom oldalam(ra/ról)",
"manifest_version": 2,
"name": "Startlapom",
"permissions": ["tabs"],
"version": "1.0"
}
managestartlapom.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Startlapom</title>
<link rel="stylesheet" href="managestartlapom.css"/>
<link rel="stylesheet" href="https://startlapom.eu/startlapom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body class="addon-body">
<div id="startlapom-addon">
<div class="panel">
<a class="addon-link" href="#" id="startlapom-add">Oldal hozzáadása a Startlapomhoz</a><br />
<div class="panel-section-separator"></div>
<a class="addon-link" href="#" id="startlapom-remove">Oldal levétele a Startlapomról</a><br />
</div>
</div>
<script src="managestartlapom.js"></script>
</body>
</html>
managestartlapom.js
document.getElementById('startlapom-add').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=ADD');
});
}
document.getElementById('startlapom-remove').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=REM');
});
}
javascript
google-chrome-extension asked Nov 26 '18 at 21:16
horikahorika
1
I created an extension what is working in Firefox.
I changed it for Google Chrome, but it is not working.
When I click on the extension's icon then popup shown with two menu option.
But when I click on any of these links nothing happened. If I press right click on any of these links and choose open in new tab then this html file shown in a new tab. If I click on links in this new tab php file will be open and works, so I think window.location.replace does not work in crome extension.
Do anybody have any idea, how can I resolve this problem?
manifest.json
{
"browser_action": {
"default_icon": {
"48": "images/startlapom-48.png",
"96": "images/startlapom-96.png"
},
"browser_style": true,
"default_title": "Startlapom",
"default_popup": "managestartlapom.html"
},
"description": "Oldal hozzáadása, levétele a Startlapom oldalam(ra/ról)",
"manifest_version": 2,
"name": "Startlapom",
"permissions": ["tabs"],
"version": "1.0"
}
managestartlapom.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Startlapom</title>
<link rel="stylesheet" href="managestartlapom.css"/>
<link rel="stylesheet" href="https://startlapom.eu/startlapom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body class="addon-body">
<div id="startlapom-addon">
<div class="panel">
<a class="addon-link" href="#" id="startlapom-add">Oldal hozzáadása a Startlapomhoz</a><br />
<div class="panel-section-separator"></div>
<a class="addon-link" href="#" id="startlapom-remove">Oldal levétele a Startlapomról</a><br />
</div>
</div>
<script src="managestartlapom.js"></script>
</body>
</html>
managestartlapom.js
document.getElementById('startlapom-add').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=ADD');
});
}
document.getElementById('startlapom-remove').onclick = function() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
window.location.replace('https://startlapom.eu/addon.php?url='+encodeURIComponent(tabs[0].url)+'&title='+encodeURIComponent(tabs[0].title)+'&reason=REM');
});
}
javascript
google-chrome-extension javascript
google-chrome-extension asked Nov 26 '18 at 21:16
horikahorika
1
asked Nov 26 '18 at 21:16
horikahorika
1
asked Nov 26 '18 at 21:16
horikahorika
1
asked Nov 26 '18 at 21:16
horikahorika
1
asked Nov 26 '18 at 21:16
horikahorika
1
1
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48
add a comment |
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48
add a comment |
1 Answer
1
active
oldest
votes
If you write in your managestartlapom.js file:
....
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
alert(window.location);
.......
}
you will see that your window.location is equal to
chrome-extension://ext_id_here/managestartlapom.html#
and I think it is not the window.location you would like to replace. (it is the window of your popup menu).
If you want to replace window.location of your active tab page, you should use chrome.tabs.executeScript in your chrome.tabs.query callback.
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
1
Or, simpler,chrome.tabs.updateto change the URL.
– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53489194%2fhow-can-i-replace-the-popup-window-with-an-other-page-in-chrome-extension%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
If you write in your managestartlapom.js file:
....
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
alert(window.location);
.......
}
you will see that your window.location is equal to
chrome-extension://ext_id_here/managestartlapom.html#
and I think it is not the window.location you would like to replace. (it is the window of your popup menu).
If you want to replace window.location of your active tab page, you should use chrome.tabs.executeScript in your chrome.tabs.query callback.
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
1
Or, simpler,chrome.tabs.updateto change the URL.
– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
add a comment |
If you write in your managestartlapom.js file:
....
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
alert(window.location);
.......
}
you will see that your window.location is equal to
chrome-extension://ext_id_here/managestartlapom.html#
and I think it is not the window.location you would like to replace. (it is the window of your popup menu).
If you want to replace window.location of your active tab page, you should use chrome.tabs.executeScript in your chrome.tabs.query callback.
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
1
Or, simpler,chrome.tabs.updateto change the URL.
– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
add a comment |
If you write in your managestartlapom.js file:
....
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
alert(window.location);
.......
}
you will see that your window.location is equal to
chrome-extension://ext_id_here/managestartlapom.html#
and I think it is not the window.location you would like to replace. (it is the window of your popup menu).
If you want to replace window.location of your active tab page, you should use chrome.tabs.executeScript in your chrome.tabs.query callback.
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
If you write in your managestartlapom.js file:
....
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
alert(window.location);
.......
}
you will see that your window.location is equal to
chrome-extension://ext_id_here/managestartlapom.html#
and I think it is not the window.location you would like to replace. (it is the window of your popup menu).
If you want to replace window.location of your active tab page, you should use chrome.tabs.executeScript in your chrome.tabs.query callback.
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
answered Nov 27 '18 at 0:18
Max KurtzMax Kurtz
1138
1138
1
Or, simpler,chrome.tabs.updateto change the URL.
– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
add a comment |
1
Or, simpler,chrome.tabs.updateto change the URL.
– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
1
1
Or, simpler,
chrome.tabs.update to change the URL.– Xan
Nov 27 '18 at 18:55
Or, simpler,
chrome.tabs.update to change the URL.– Xan
Nov 27 '18 at 18:55
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
Yes I know, this is the popup window, but I would like to show the php page in this popup window, not in the new tab.
– horika
Nov 30 '18 at 11:45
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53489194%2fhow-can-i-replace-the-popup-window-with-an-other-page-in-chrome-extension%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Looks like Chrome forbids navigating the popup to a non-extension URL. I think you'll have to add an iframe (sized to the entire popup dimensions) and assign its src property.
– wOxxOm
Nov 27 '18 at 6:00
To clarify (I'm guessing the answer is correct): are you trying to change the active tab's URL, or are you trying to replace the contents of the popup itself (then why are you querying for tabs?)
– Xan
Nov 27 '18 at 18:56
I would like to replace content of popup window, tabs query is needed for me because I would like to post the current tab url and title to php page as you can see in managestartlapom.js.
– horika
Nov 30 '18 at 11:48