I have embedded a YouTube player using YTPlyaer ver 3.2.9
On desktop and android devices everything works perfectly fine,
On IOS the firescreen button is missing
This is the init code im using:
var video_source = "https://www.youtube.com/embed/somecode";
this.youtube_player_element.YTPlayer({
containment: 'self',
videoURL:video_source,
ratio:'4/3',
optimizeDisplay: true,
showYTLogo: false,
addRaster: false,
showAnnotations: false,
});
Related
I'm trying to display a pdf and perform few actions like next/prev page, search, etc.
all working fine expect for the search functionality which according to documentations something like this should do it, but no luck for me:
pdfViewer.findController.executeCommand('find', {
caseSensitive: false,
findPrevious: undefined,
highlightAll: true,
phraseSearch: true,
query: "searchQuery"
});
Anyone has any experience with this lib?? I have created a working version here: https://svelte.dev/repl/424f34b68f364158b3a74b1566100c27?version=3.53.1
I am running some tests via Nightwatch and Appium, and I have been unable to successfully implement a scroll action using the iOS Simulator. My tests are set up to be able to run on a Chrome, Safari, or Firefox browser, or an iOS Simulator using Safari. The application is built using React, and I am using Javascript. Everything runs smoothly until I have to scroll to a particular element on the screen.
When using the web browsers, all I need to do is send a .click() method on a specific element, and that automatically brings the element into view, but on the iOS Simulator that does not appear to be the case.
This is what I have set up for iOS in my nightwatch.conf.js file. So far any methods that I have seen from my searching online have come up short. The Appium docs have several methods listed, but none of them have been executable, or have failed silently. Does anyone have a possible solution or suggestion about how to properly execute a scroll using this set up? Thanks, and much appreciated
"ios": {
"selenium_start_process": false,
"selenium_port": 4723,
"selenium_host": "localhost",
"silent": true,
"automationName": "XCUITest",
"desiredCapabilities": {
"browserName": "safari",
"platformName": "iOS",
"platformVersion": "12.2",
"deviceName": "iPad Pro (9.7 -inch)"
}
},
Here is an example of what I have tried to implement (The goal is to move to the button element and click it once it's into view - it's a dropdown)
browser
.assert.elementPresent('div[data-mr="quiz-dont-know"]')
.click('div[data-mr="quiz-dont-know"]')
.assert.elementPresent('div[data-mr="grey-info"]')
browser.pause(2000)
browser.element('css selector', 'div[data-"mr=grey-info"]', function(button) {
console.log("THIS ELEMENT IS " + button.value.ELEMENT);
browser.moveTo(button.value.ELEMENT, 10, 10)
browser.elementIdClick(button.value.ELEMENT);
})
.pause(2000)
.assert.elementPresent('div[data-mr="grey-info-options"]')
I think you want to use ".scrollIntoView()"
buttons.value.forEach((button, index) => {
browser.elementIdText(button.ELEMENT, result => {
if(result.value === 'None') {
console.log("THIS ELEMENT IS " + button.ELEMENT);
browser.execute(function(button) {
//var elmnt =button // based on user comment
var elmnt = document.querySelector([data-mr="grey-info"]')
elmnt.scrollIntoView();
});
browser.elementIdClick(button.ELEMENT);
}
});
});
Piggybacking on Jortega's suggestion, I found a solution. Though his initial suggestion was unsuccessful, I wrestled with it a bit and found out that if I use document.querySelector([data-mr="grey-info"]') and assign a variable to that, THEN I was able to call the scrollIntoView method. Much obliged
I want to simulate a mobile device in desktop environment. I can't find a argument to transform mouse event to touch event.
How can I approach this job? Any hint will be great. Thank you so much.
I think I figured it out. Dev environment:
node 7.4.0
Chromium 54.0.2840.101
Electron 1.5.1
const app = electron.app
const BrowserWindow = electron.BrowserWindow
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({
width: 1024,
height: 768,
frame: false,
x: -1920,
y: 0,
autoHideMenuBar: true,
icon: 'assets/icons/win/app-win-icon.ico'
});
try {
// works with 1.1 too
mainWindow.webContents.debugger.attach('1.2')
} catch (err) {
console.log('Debugger attach failed: ', err)
}
const isDebuggerAttached = mainWindow.webContents.debugger.isAttached()
console.log('debugger attached? ', isDebuggerAttached)
mainWindow.webContents.debugger.on('detach', (event, reason) => {
console.log('Debugger detached due to: ', reason)
});
// This is where the magic happens!
mainWindow.webContents.debugger.sendCommand('Emulation.setTouchEmulationEnabled', {
enabled: true,
configuration: 'mobile',
});
mainWindow.loadURL(url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true,
show: false,
backgroundColor: '#8e24aa ',
}));
// Show the mainwindow when it is loaded and ready to show
mainWindow.once('ready-to-show', () => {
mainWindow.show()
})
}
// Listen for app to be ready
app.on('ready', createWindow);
Take a look at this Electron github issue or this Atom Discussion for ideas on how to get the touch working with Electron.
As far as how to approach it, I would look through the mouse events and touch events and just wire up a function that combines the Electron api and the relevant web api for mouse/touch.
Looking at the web-contents API, the only thing you can do is to open the dev tools with:
// win being a BrowserWindow object
win.webContents.openDevTools();
Then you will have to manually click on the responsive tools (the smartphone icon), and you will get into the mode you want.
But I am afraid there is no way to do it programatically. Mostly because it is considered as a development tool, and not a browser feature, so you will have the toolbar at the top and all these things. Not really something you want on Production.
You can try to use Microsoft Windows Simulator. You need to install Visual Studio 2019 with Universal Windows Platform development then run the simulator through:
C:\Program Files (x86)\Common Files\Microsoft Shared\Windows Simulator\16.0\Microsoft.Windows.Simulator.exe
I tested my electron app that also needs to run well both on touchscreen devices and devices without touch screen using this and it works really well to simulate touchscreen devices.
Do not forget to switch to touchscreen input on the right side of the panel, otherwise, the default input will simulate a mouse pointer.
I am using popcornjs to load an interact with a video from youtube.
When I use the code from the documentation:
<html>
<head>
<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>
<script>
// ensure the web page (DOM) has loaded
document.addEventListener("DOMContentLoaded", function () {
// Create a popcorn instance by calling the Youtube player plugin
var example = Popcorn.youtube(
'#video',
'http://www.youtube.com/watch?v=CxvgCLgwdNk' );
// add a footnote at 2 seconds, and remove it at 6 seconds
example.footnote({
start: 2,
end: 6,
text: "Pop!",
target: "footnotediv"
});
// play the video right away
//example.play(); => commented because you can't autoplay on ios
}, false);
</script>
</head>
<body>
<div id="video" style="width: 360px; height: 300px;" ></div>
<div id="footnotediv"></div>
</body>
</html>
It looks perfect on any browser, but nothing shows on the iPad.
When I load a video with popcorn but without using Youtube, it seems to work fine.
What can I do?
Unfortunately, the ipad doesn't support Flash. We do have a ticket in progress with Popcorn to switch to their HTML5 API, which you can view here:
https://webmademovies.lighthouseapp.com/projects/63272/tickets/329-support-youtube-html5-api-playback-engine
Hope that helps,
Brett
Try using the smart media wrapper:
var example = Popcorn.smart(
'#video',
'http://www.youtube.com/watch?v=CxvgCLgwdNk' );
// add a footnote at 2 seconds, and remove it at 6 seconds
example.footnote({
start: 2,
end: 6,
text: "Pop!",
target: "footnotediv"
});
// play the video right away
//example.play(); => commented because you can't autoplay on ios
}, false);
I too am facing the issue, Youtube Popcorn is not working in iPad. But interestingly I found a site using popcorn youtube and it works fine in iPad
Link:
http://www.retn.org/show/south-burlington-school-board-meeting-october-2-2013
So, I guess someone should come up with more specific answer
Edit this file in your code:
https://github.com/mozilla/popcorn-js/blob/master/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js
Comment body part of onPlayerReady() on line no 117 and add following statements in this function in case of iPad.
addYouTubeEvent("play", onFirstPlay);
playerReady = true;
mediaReady = true;
player.mute();
Reason: Youtube on iPad wants user interaction, you can't start it programmatically and due to player.isMuted() method returns false in case of iPad, addYouTubeEvent("play", onFirstPlay) statement is never called.
I'm trying to display an alert message when a user clicks on one of the vectors is in the vector layer. This works fine in all browser, except IE8.
map = new OpenLayers.Map(id, {
theme: null
});
vectorLayer = new OpenLayers.Layer.Vector("Vector Layer");
map.addLayer(vectorLayer);
selectControl = new OpenLayers.Control.SelectFeature(vectorLayer);
vectorLayer.events.on({
'featureselected': onPopupFeatureSelect,
'featureunselected': onPopupFeatureUnselect
});
map.addControl(selectControl);
selectControl.activate();
// ...
function onPopupFeatureSelect(feature) {
alert("OK");
} // <-- Exceptions are thrown here
Whenever the onPopupFeatureSelect function is finished (at {) the IE8 debugger somehow falls into the JQuery code and throws exceptions there.
Am I using the select feature correctly?
Update: The crash occurs when I click anywhere in the map. It is not related to the popup feature.
JQuery in combination with VML was causing this problem. I updated to version 1.7.1 and everything is working fine.
More information here: http://bugs.jquery.com/ticket/7071