I'm try to use html5 notification,now i'm strggle to load html element into notifications body
Below code I've tried
let string = document.getElementById('map')
let myNotification = new Notification('Incomming calls', {
body: string.innerHTML
}).addEventListener('click',function(){
console.log('Notification clicked' + message)
})
Thanks in advance
You might want to check if notification works for the browser you are using as test, better still check check this link with this also.
Then you need to be more specific about what the issue is, is there an error message or an output you don't like for us to help you better
Related
Note, this is related to my previous question here: https://stackoverflow.com/a/73043433/4190664
I am looking to further assert somethings within the DOM when I click the 'Print' button.
From troubleshooting I am seeing the following:
the pdfjs page has a #printContainer that is an empty div
when you click the Print button, it begins creating divs with the class .printedPage to represent each page of the document
within each .printedPage div is an img element with src="blob:https://mozilla.github.io/**"
Example when the print dialog is open:
<div id="printContainer">
<div class="printedPage"><img src="blob:https://mozilla.github.io/5afcff4c-aa36-4118-b4b8-011cdce6a9bc"></div>
<div class="printedPage"><img src="blob:https://mozilla.github.io/30cd3036-2d81-4b82-af9a-0f2e9c834b69"></div>
<div class="printedPage"><img src="blob:https://mozilla.github.io/047e8762-3fae-44d1-a5a0-56ea576de93e"></div>
</div>
I already am testing the following:
let requestCount = 0;
page.on('request', request => {
if(request.url().includes('blob:https://mozilla.github.io/pdf.js/web/viewer.html')) {
expect(page.locator(`.printedPage img >> nth=${requestCount}`)).toHaveAttribute('src', /blob:https:\/\/mozilla.github.io/);
requestCount++;
}
});
await printBtn.click();
await expect.poll(() => requestCount).toBe(3);
What would be the best way to assert that each .printedPage > 'img' src contains the blob information as well?
Playwright (and javascript in general) is not a strong language so I am definitely struggling on this one 😬
Any syntactical help is appreciated
You can do something like this. You can add this before the value of requestCount increments.
await expect(
page.locator(`.printedPage img >> nth=${requestCount}`)
).toHaveAttribute('src', /blob:https:\/\/mozilla.github.io/)
if (response.success) {
this.redirectURL = response.data.loginUrl;
// this.URL='http://'+location.host+'/login'+'/'+this.redirectURL;
this.router.navigate(['/login?token=', this.redirectURL]);}
Here is the code ,it should move me to cognito page but its moving to login page in angular I am not sure where I am wrong
use +(plus) instead of ,(comma)
this.router.navigate(['/login?token='+this.redirectURL]);}
If you want to use query params, you can also adopt this approach.
this.router.navigate(['login'], { queryParams: { token: 20 } });
Most likely the reason behind the issue you are facing is that the comma-separated navigation turns to slash-separated one, e.g.
let redirectURL = '1234'
this.router.navigate(['/login?token=', redirectURL])
// this line above results to /login?token=/1234'
So in order to avoid that you should either use the solution that I suggest or the one mentioned by abhishek sahu, where the usage of + for concatenation is encouraged.
I'm trying to add an img tag to a wicket page. I have not the image as file, I have its URL. I retrieve the URL using a REST service that is consumed in the page constructor.
I tried the following code, but it didn't work (I got a Failed to find markup file associated exception):
image = new Image("chart-img", title);
add(image);
image.getMarkupAttributes().put("src", url);
Can anyone help me?
Thanks
Laura
You can try this also
Image image = new Image("chart-img", "");
image.add(new AttributeModifier("src", url);
image.add(new AttributeModifier("title", title);
add(image);
You just use a WebmarkupContainer for that:
image = new WebMarkupContainer("chart-img") {
protected void onComponentTag(final ComponentTag tag)
{
super.onComponentTag(tag);
tag.put("src", url);
tag.put("title", title);
}
};
add(image)
Since some time there is also org.apache.wicket.markup.html.image.ExternalImage for exactly this use case.
used jssor slider , i have some pages with same jssor slider , some pages are working fine , but some pages comes Outer container 'null' not found. bug , can any one help on this ?
I had a similar problem, so did some digging to see what the issue was.
The setup starts with the initial call, here's the snippet from the demo site
http://www.jssor.com/development/index.html
var jssor_slider1 = new $JssorSlider$("slider1_container", options);
which, among setting up all kinds of utility functions- more importantly does this
function JssorSlider(elmt, options) {
var _SelfSlider = this;
...
// bunch of other functions
...
$JssorDebug$.$Execute(function () {
var outerContainerElmt = $Jssor$.$GetElement(elmt);
if (!outerContainerElmt)
$JssorDebug$.$Fail("Outer container '" + elmt + "' not found.");
});
}
so at this point, it's trying to collect the string you passed, which is the elmt variable- which is for what? Well let's take a look at that $GetElement function in jssor.js
_This.$GetElement = function (elmt) {
if (_This.$IsString(elmt)) {
elmt = document.getElementById(elmt);
}
return elmt;
};
So, really, what it comes down to is this line for finding the element.
elmt = document.getElementById(elmt);
So the base of this error is
"We tried to use your string to find a matching ID tag on the page and it didn't give us a valid value"
This could be a typo, or another line of code modifying/removing the DOM.
Note that there are some scripts try to remove or modify element in your page.
Please right click on your page and click 'Inspect Element' menu item in the context menu.
Check if the 'outer container' is still there in the document. And check if there is another element with the same id.
Check if "Slider1_Container" is present or Used.
In my case, I didn't have it in my html, but still I had added the js.
Removing js resolved my issue.
I've created a page with an empty iframe on it. I can then select the iframe document and navigate to it's body:
var iframe = document.getElementsByTagName('iframe')[0];
var doc = iframe.contentDocument || iframe.contentWindow.document;
var body = doc.body;
console.log("Body is", body);
In firefox and chrome this gives me the body object. In IE10 it gives me null.
Here is a Jsbin demonstrating the issue. Open up the JS, Console, Output panels and click "Run With JS".
Two questions:
How do I get access to the iframe's body in a cross-browser manner?
Which is the correct "to-spec" behavior?
I had a similar problem earlier today. It seems IE, at least 9 and 10, doesn't create the iframe body correctly (when I used the developer tools I was able to see a body tag inside the iframe, but like you wasn't able to call it), when there's no specified src. It gives you null cause it doesn't exist.
The answer, to whether there is a cross browser manner to access the iframe's body, is no. BUT, you could use a workaround. First, check if the iframe body exist, if not, then create it.
Your code would look like this:
var iframe = document.getElementsByTagName('iframe')[0];
var doc = iframe.contentDocument || iframe.contentWindow.document;
// The workaround
if (doc.body == null) { // null in IE
doc.write("<body></body>");
}
var body = doc.body;
console.log("Body is", body);
Source: http://forums.asp.net/t/1686774.aspx/1
This code is working for me cross-browser:
var doc=ifr.contentWindow||ifr.contentDocument;
if (doc.document) doc=doc.document;
var body=doc.getElementByTagName("body")[0];
Over a year later but I believe the solution was to call
doc.open()
//make any modifications
doc.close()
//at this point doc.body will not be null
This made things work in a fairly consistent manner cross browser