I cannot open the webcam in p5.js - webcam

In p5js editor, I wanted to test the example called capture to turn on my webcam on my mac pro.
The code must be correct since I used the example that already existed, but the camera is not turning on and I do not know why.
the console says:
{
"constraintName": "",
"message": "",
"name": "InvalidStateError"
}
let capture;
function setup() {
createCanvas(390, 240);
capture = createCapture(VIDEO);
capture.size(320, 240);
//capture.hide();
}
function draw() {
background(255);
image(capture, 0, 0, 320, 240);
filter(INVERT);
}

Using the P5.js webcam feature requires the user to click "allow" before allowing the camera. This code executes on the P5.js web editor ( https://editor.p5js.org/ ). It looks like this :
If you want to execute the code locally, I would recommend using a Node Static Server or an editor with built-in capabilities of running a server locally. I personally use Brackets ( http://brackets.io/ ), which allows you to run HTML websites in a contained static node environment through Google Chrome. I tried executing this example on Brackets and it worked fine.

Related

How do I fix the browser window size in Behat 3 / Mink?

I want to run all my Behat/mink tests at a mobile display resolution. What would be really nice is to run all the tests with Chrome in dev tools mode where you can select "iPhone 5/SE" and so on to get a simulation of running on that device.
So, I tried to implement something like this myself by setting the display resolution in FeatureContext.
Here's an SO question on how to resize browser windows with Behat 2. And there's sample code for setting the window resolution in Behat/Mink/Drupal.
Based on these examples, I added the following code to my FeatureContext:
/**
* #BeforeScenario
*/
public function resizeWindow()
{
$this->getSession()->resizeWindow(100, 500, 'current');
}
However, I'm getting this error:
Fatal error: Call to a member function window() on null
(Behat\Testwork\Call\Exception\FatalThrowableError)
I also tried:
Using BeforeStep instead of BeforeScenario (result: same error)
Adding a step "I set the resolution to A x B" (result: I can resize the window in tests this way, but when I submit a form in a test, the screen resolution is reset; to fix this, I can add the step to set the resolution after each other step, but that is very inefficient)
I tried setting the window size as a chrome switch in behat.yml, but I couldn't get this to work either (the window size didn't change)
My goal: to force all tests to be executed under Chrome with a fixed window size
To do this in #BeforeScenario:
/**
* #BeforeScenario
*/
public function resizeWindow()
{
if ($this->getSession()->getDriver() instanceof Selenium2Driver) {
$this->getMink()->getSession()->start();
$this->getSession()->resizeWindow(100, 500, 'current');
}
}
To do this in #BeforeStep:
/**
* #BeforeStep
*/
public function resizeWindowStep()
{
$is_session = $this->getMink()->isSessionStarted();
if (!$is_session) {
$this->getMink()->getSession()->start();
}
$this->getSession()->resizeWindow(100, 500, 'current');
}

selenium webdriverio click on android/iPhone/iPad broswers

I have a test that passes on all devices except my mobile ones and it seems to be failing at click(). I am using selenium webdriver, here's a code snippet:
it('Expand when clicked', function (done: any) {
client
.waitForVisible('[pane-state-value="focused"] [pane-state-value="focused"] .smartimage-container-small', 15000)
.click('[pane-state-value="focused"] [pane-state-value="focused"] .smartimage-container-small')
.waitForVisible('body > .smartimage-container-large [fullscreen-image]', 15000)
.getElementSize('body > .smartimage-container-large [fullscreen-image]').then(function (fullscreenSize: any) {
client.getElementSize('body').then(function (bodySize: any) {
assert.equal(bodySize.width, fullscreenSize.width, 'fullscreen doesn\'t use full width');
assert.equal(bodySize.height, fullscreenSize.height, 'fullscreen doesn\'t use full height');
})
.call(done);
});
});
I came across an article, https://saucelabs.com/resources/articles/the-selenium-click-command, that indicates that the click command is not supported on the mobiles devices but I was told that these tests were previously passing so I wanted to make sure I wasn't missing something more obvious. I have tried calling doubleClick() and adding a pause before the click. The click function executes but nothing happens on the emulated mobile device. I have also plugged my phone and checked dev tools and have ensured that the selector exists.

Browser How to maximize the browser automatically while playback

How to maximize the browser automatically while playback the web application script in rational functional tester(Rational Functional Tester)?
Simply call maximize() on the BrowserTestObject:
startApp("Google");
browser_htmlBrowser().maximize();
Or record the click on the maximize Button, which gives you:
browser_htmlBrowser(document_google(),DEFAULT_FLAGS).maximize();
The following code will find the open browsers and maximize the ones found
void maximizeBrowsers()
{
TestObject[] browsers = find(atChild(".class","Html.HtmlBrowser"));
System.out.println("Browsers found : "+ browsers.length);
for(TestObject browser:browsers)
{
//add addional check if required to get to the right browser
((BrowserTestObject)browser).maximize();
}
unregister(browsers);
}
startBrowser("Internet Explorer","www.google.com");
browser_htmlBrowser().click();

Switching to a window with no name

Using the Codeception testing framework and Selenium 2 module to test a website, I end up following a hyperlink that opens a new window with no name. As a result the switchToWindow() function will not work because it is trying to switch to the parent window (which I'm currently on). Without being able to switch to the new window I cannot perform any testing on it.
<a class="external" target="_blank" href="http://mylocalurl/the/page/im/opening">
View Live
</a>
Using both Chrome and Firefox debugging tools I can confirm the new window doesn't have a name, and I cannot give it one because I cannot edit the HTML page I am working on. Ideally I would have changed the HTML to use javascript onclick="window.open('http://mylocalurl/the/page/im/opening', 'myPopupWindow') however this is not possible in my case.
I've looked around on the Selenium forums without any clear method to tackle this problem, and Codeception doesn't appear to have much functionality around this.
After searching around on the Selenium forum and some helpful prods from #Mark Rowlands, I got it to work using raw Selenium.
// before codeception v2.1.1, just typehint on \Webdriver
$I->executeInSelenium(function (\Facebook\WebDriver\Remote\RemoteWebDriver $webdriver) {
$handles=$webdriver->window_handles();
$last_window = end($handles);
$webdriver->focusWindow($last_window);
});
Returning back to the parent window was easy because I could just use Codeception's switchToWindow method:
$I->switchToWindow();
Building on the accepted answer, in Codeception 2.2.9 I was able to add this code to the Acceptance Helper and it seems to work.
/**
* #throws \Codeception\Exception\ModuleException
*/
public function switchToNewWindow()
{
$webdriver = $this->getModule('WebDriver')->webDriver;
$handles = $webdriver->getWindowHandles();
$lastWindow = end($handles);
$webdriver->switchTo()->window($lastWindow);
}
Then in the test class I can do this:
$I->click('#somelink');
$I->switchToNewWindow();
// Some assertions...
$I->switchToWindow(); // this switches back to the previous window
I had a heck of a time trying to figure out how to do this by just searching google, so I hope it helps someone else.
Try this,
String parentWindowHandle = browser.getWindowHandle(); // save the current window handle.
WebDriver popup = null;
Iterator<String> windowIterator = browser.getWindowHandles();
while(windowIterator.hasNext()) {
String windowHandle = windowIterator.next();
popup = browser.switchTo().window(windowHandle);
}
make sure to return on parent window using,
browser.close(); // close the popup.
browser.switchTo().window(parentWindowHandle); // Switch back to parent window.
I hope will help you.
Using Codeception 2.2+ it looks like this:
$I->executeInSelenium(function (\Facebook\WebDriver\Remote\RemoteWebDriver $webdriver) {
$handles = $webdriver->getWindowHandles();
$lastWindow = end($handles);
$webdriver->switchTo()->window($lastWindow);
});

Posting canvas image to user's wall via facebook javascript sdk

I have dynamically created a html canvas image. I want to post it to facebook user's wall via javascript sdk. What I am doing is
I tried to convert canvas into a javascript image object & provide finalimage in fb.ui method
var temp = canvas.toDataURL("image/png");
var finalimage=temp.replace(/^data:image\/(png|jpg);base64,/, "");
FB.ui(
{
method: 'feed',
name: 'The Facebook SDK for Javascript',
caption: 'Bringing Facebook to the desktop and mobile web',
description: (
'A small JavaScript library that allows you to harness ' +
'the power of Facebook, bringing the user\'s identity, ' +
'social graph and distribution power to your site.'
),
link: 'https://developers.facebook.com/docs/reference/javascript/',
picture: finalimage
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
But I am getting an error
Error Message: picture URL is not properly formatted
Can anyone please help how do I do that??
You need to save the image at your server for doing that, your image must be outside Facebook, because FB.ui "FEED" does not accept base64 encoded data as picture, its impossible .
Its very large data, and if you try to short the base64 code into a url shorteer, you will find difficulties too .
What you can do, and what i am doing, is use an PHP server to get the Base64 data, and convert it into image, like a dynamic image, ok? But a memory problem will be created .
Another option is (really) posting the canvas as an image on user profile, so you will need use FB.api for that, instead of FB.ui, feed dialog is used for sharing links, and, canvas doesnt have Title, Description, proprieties .
After posting the image, you will get an response, with ID, that is post ID, and this cannot be used on Feed as Link or Image proprietity, but you can use Share Dialog, if you want to share the post .
That is piece of cake, i done that, and recommend you do the same .
Posting Canvas as images usin API on Facebook Platform is great, you can do that using JavaScript SDK .