Google Chrome Dev Tools Mobile View not showing Iframe content - html

I've noticed that the iframe I used within a pop up modal I made does not show in Google Chrome's mobile view from the developer tools. The content will show if I'm on desktop view and also when I'm adjusting the size of the browser window (Not using Chrome dev tools). On Safari, it works perfectly fine in the safari developer tools and desktop view.
I've made sure to set the X-frame content to SAMEORIGIN which I observed in the response correctly. I've also made sure both URLs are the same domain and both HTTPS. But the same issue still occurs.
Do you know any additional causes for this or what I can look into? I'm also open to other approaches/suggestions. Thank you for your time!

Since I can't change the way the browser handles iframe on different devices. I decided to deter away from working with the in-built PDF reader within each browser to instead using a react pdf library to spin up a PDF reader of my own.
https://www.npmjs.com/package/react-view-pdf
I was able to view the pdf on Google Chrome for both Desktop and Mobile devices!

Related

why are the widgets not displayed

I have a simple web page that contain a widget
http://www.mccdepot.com.au/index6.html
This works on chrome, IE, firefox and safari.
But on a samsung TV I have the inbuilt browser does not show anything at all.
The browser is launched with an application called 'URL Launcher'
The model number is DM40E and it is using a browser called 'Hospitality browser' but the underlying browser is tizen.
When i checked the browser using whatbrowser.org it told me it was 'webkit nightly 537'
Can anyone help? any way to get these widegts shown on my tv.. I have no control of the widget code..
Any help is apprceiated
TV Model - http://displaysolutions.samsung.com/digital-signage/detail/431/DM40E
Ta
Vik
What happens if you try to access the iFrame source URL (https://cdnres.willyweather.com.au/widget/loadView.html?id=43747) directly?
If that works, it probably has something to do with the TV browser not supporting or purposely preventing iFrame content.

Silverlight Display Mixed Content crashes IE

So, I have an HTML page that includes a Silverlight xap file which plays a video. It works correctly while running locally and on our DEV environment when using Chrome or FF. The issue is when I am trying to view the video on our DEV environment using Internet Explorer. When doing so, it prompts me to Display Mixed Content. Whether I hit Yes or No, the browser crashes. I am able to go into my options and Enable Display Mixed Content, which fixes the issue and the video shows up correctly on the DEV environment using IE. But, this is not a good solution for a client facing site. Is there a way around this message to prevent it from crashing the browser?
A workaround for this is to use JavaScript to open the HTML page that contains the video in a new window. The user will still be prompted to Display Mixed Content, but it will not crash the browser and the video will play.

Need a chome mobile to auto reload a tab/page

I have a google spreadsheet that is accessed via the web using an Android tablet. The android tablet uses Chrome, the mobile version obviously. The desktop version of Chrome has an extension for auto reload, currently mobile doesn't support extensions. Does anyone have an idea as to how I can accomplish this? I tried a bookmark script, works on my desktop but not the mobile version. I have to be able to access the bookmark from the page and can't do it on mobile. Thanks for any advice!
A page with an <iframe> and a <button> to reload its contents?

open pdf in iphone webapp

I am trying to open a pdf from my JQM webapp. I have tried iframes/embed/object, and none of those work on an iphone like they do on a desktop browser (scrolling, zooming, etc). I have settled with simply opening the pdf via a link Link. This works fine in the standard browser because the user can simply use the browser back button to navigate back to my app.
The issue that I am having, is that when a user saves the page to thier home screen and opens it using the chromeless safari browser, they no longer have the browser back button. I have tried adding target="_blank" to the link, but apparently JQM hijacks the link and prevents opening in a new page, and I have been unable to get the hacks to work.
I have also tried pdf.js, but I can't seem to even get that to work as my javascript knowledge is fairly limited, and the examples are pretty advanced. The only tutorial that I found used an old version which I couldn't get to work.
Are there any ways to bypass the JQM in openning a link in a new window (which would in turn open in the mobile safari rather than my chromeless web app), or are there any other suggestions for how to open a pdf from a webapp?
Just disable the default jQuery Mobile behaviour, by specifying data-ajax=false.
For example:
Link
See http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
For my webApps I used https://docs.google.com/viewer to embed the pdf into my interface.
So, when I navigate the webApp by home screen icon, the app doesn't close when I open the pdf.
I met the same question: open pdf in webapp with html5.
I've tried several solutions: iframe、embed、pdf.js, but none of them is the best solution.
tips: iOS 9.x upper, open pdf with iframe only show the first page of the pdf file, and there will be a <img /> tag in the iframe body when you debug.
util now I still have this troublesome problem, anyone has solution please write your experience here.
Thank you.

Not able to copy text,XPath or other attribute from the chrome developer tool

I followed the approach mentioned in how to emulate a mobile (android) browser on desktop
to project the mobile webpage's properties on desktop chrome browser. I was successfully able to do that but now I have some queries as mentioned below, please let me know your inputs on that
a) How to use the "Select element option" of chrome developer toolbar to view an element's property for a mobile webpage. In normal desktop chrome browser we have the web page displayed and below that the developer toolbar is displayed and we can easily spot the element using a pointer but with mobile webpage displayed on desktop chrome browser i am not able to use this option as the webpage is not displayed.
b) I tried to copy the xpath and other things from the displayed HTML (HTML of mobile webpage on desktop chrome browser) but it gave me an error that "You need to install a Chrome extension that grants clipboard access to Developer tools". I installed one such extension named: "Auto Copy" but then also I was not able to copy. Please let me know how to go about it.
Thanks a lot in advance,
Namit
For (B) – Judging from the discussion when that message was introduced, it sounds like you need to roll your own simple custom extension to enable clipboard access. Here's a sample manifest.json – I haven't tested it out myself, but it looks pretty straightforward. The extension development Getting Started guide explains how to turn a file like this into a working extension and install it locally.