What is the best way to test an externally hosted application with Testacular and AngularJS?

I have a Pyramid app running on http://localhost:6543.

  • This app serves the AngularJS app at /.
  • This app utilizes socket.io.

The query is: Can I test this application using these tools?

In my scenario.js file, I have the following:

beforeEach(function() {
   browser().navigateTo('http://localhost:6543/');
});

However, when I try to launch testacular (with run or start), I encounter the following error message:

Chrome 23.0 registration: should delete all cookies when user clicks on "remove all" button FAILED
browser navigate to 'http://localhost:6543/'
/home/abourget/myapp/jstests/scenarios/registration_scenario.js:9:5: Sandbox Error: Application document not accessible.

It seems that the browser restricts access to the iframe's document due to Cross-Origin violations.

Here's what I've tried:

  • Attempting to proxy to my app using the Testacular web server (using the proxies option), but encountered conflicts with Testacular's framework serving at /. Additionally, both apps trying to use /socket.io resulted in conflicts.
  • Exploring the reverse approach by tweaking my app to proxy to Testacular's server, yet faced similar issues with /socket.io.

Appreciate these fantastic tools!

javascriptangularjsjasminekarma-runner

Answer №1

Instead of using

beforeEach(function() {
    browser().navigateTo('http://localhost:6543/');
});

You should modify it to

beforeEach(function() {
    browser().navigateTo('/');
});

Also, make sure to update your testacular-e2e.conf.js file with the following:

proxies = {
    '/': 'http://localhost:6543/'
};

While there may be other issues present, I was able to replicate the "Sandbox Error: Application document not accessible." message simply by setting up the Pyramid Hello World App incorrectly in this manner.

Answer №2

Dealing with a comparable issue, we had utilized proxies and the navigateTo('/') function. To prevent conflicts while loading socket.io, we found it necessary to incorporate a urlRoot. By simply adding '/e2e', we were able to successfully resolve the conflict. Interestingly enough, testacular issued a warning message regarding this problem during testing.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Creating a live child component using React

My issue lies with the menu component, which is supposed to dynamically load elements in another container component. Unfortunately, the child elements are not being rendered. App.js import React, { Component } from 'react'; import './App. ...

javascriptreactjses6-modules

The JavaScript code runs first before retrieving any information from the server

When it comes to validating coupons on Stripe, the process needs to be done on the server side rather than the client side. I've tackled this by writing some code for validation, but I'm facing challenges with synchronizing the AJAX/JSON response ...

javascriptjqueryruby-on-railsjsonajax

Transforming conversion code snippet from jQuery to Dojo - utilizing AJAX techniques

I am in the process of converting my code from jQuery to Dojo. I just need an equivalent snippet that works. The jQuery code is functioning properly, but the Dojo code is not working as expected. JQUERY <script type="text/javascript"> $(docume ...

javascriptjqueryajaxdojo

Using Aframe and JavaScript to create split id animations

I am currently working on an Aframe WebVR app and trying to develop a function that splits this.id into two parts, assigns it to a variable, and then uses setAttribute. This is the code I have: AFRAME.registerComponent('remove-yellow', { init ...

javascripthtmlaframewebvr

Navigate your way with Google Maps integrated in Bootstrap tabs

Trying to display a Google Map in a vanilla Bootstrap tab has been quite the challenge. I created a fiddle based on the Bootstrap docs, and followed Google's instructions for the Gmap script. The map object appears initialized when checking console.di ...

javascriptjquerygoogle-maps-api-3twitter-bootstrap

Managing absence of ID field in Prisma and retrieving data from API request

When fetching data from an API, my approach looks like this: async function getApiData() { const promises = []; for (let i = 0; i < PAGE_COUNT; i++) { const apiData = fetch(...); } const apiData = await Promise.all(promises); return apiDat ...

javascripttypescriptpostgresqlmodelprisma

Inject a DOM event into a personalized form validator within an Angular application

I'm currently working on validating a form using the reactive approach. I've implemented a file input to allow users to upload files, with custom validation conditions in place. However, I'm encountering an issue where the validator only rec ...

javascriptangulartypescript

The issue of jQuery's .last() function triggering multiple times with just a single click on the last

I currently have a set of tabs containing radio buttons and I need to trigger an event when the last option is selected (meaning any radio button within the final tab, not just the last radio button). Below is the HTML code: <div id="smartwizard" clas ...

javascriptjqueryhtml

Adjust the database table when a session expires in PHP

Within my PHP code, there is a session timeout feature that triggers after 60 minutes of inactivity. This code snippet resides in the file /mno.php, where both the login and logout functionalities are also implemented. /mno.php if (isset($_SESSION[' ...

javascriptphpsqlajaxsession-timeout

What is the best way to split key and value into separate array objects using JavaScript?

Here's a snippet of code I am working with: let obj = {EdadBeneficiario1: '32', EdadBeneficiario2: '5'} var years = []; let i; for (i= obj;i<=obj;i++) { years.push({ edad_beneficiario : i }) } When I run this code, the output i ...

javascriptarraysreactjsobjectecmascript-6

Having trouble with accessing PHP data through jQuery's AJAX response

Having just started exploring AJAX, I'm facing an issue with a simple login script using jQuery 1.6.4. The AJAX function sends the email address and password to 'login.php' upon clicking a button. Everything seems to be working smoothly unti ...

phpjavascriptjqueryajax

Display a span element using jQuery datatable to indicate that the update operation was

I have implemented inline editing using jQuery Datatables. Currently, I am trying to display a green checkmark when a record gets updated. Below is the ajax call that populates the table: $.ajax({ url: 'api/massEditorSummary.php', type: &ap ...

javascriptjquerycssajaxdatatables

Utilizing cylon.js with Nest Thermostat

Experiencing errors while trying to retrieve thermostat ambient Temperature with cylon.js I have already replaced ACCESS_TOKEN with my unique access token and device id Sample Code: var Cylon = require('cylon'); Cylon.robot({ connections: { ...

javascriptnode.jsnest-api

Angular2: the setTimeout function is executed just a single time

Currently, I am working on implementing a feature in Angular2 that relies on the use of setTimeout. This is a snippet of my code: public ngAfterViewInit(): void { this.authenticate_loop(); } private authenticate_loop() { setTimeout (() =& ...

javascriptangulartypescriptsettimeout

Is it possible to programmatically open the Firefox browser console using JavaScript within an extension?

I attempted to link toJavaScriptConsole() with a button, however it is not functioning (undefined reference error) Is there a way to code an XUL button that will launch the firefox browser console, allowing us to view logs from the extension? ...

javascriptfirefox-addonxul

Display and conceal frequently asked questions using JQuery

I'm currently facing an issue with using JQuery to toggle between showing and hiding content when a user clicks on a specific class element. Here is my HTML code: <div class="faqSectionFirst"> Question? <p class="faqTextFirst" style=' ...

javascriptjquery

Moving from one page to another

I am attempting to create a transition effect between sections within a single-page application. All the sections are contained on the same page, with only one section displayed at a time while the rest are set to display none. When a specific event is tri ...

javascripthtmlcsscss-transitions

Javascript - Single line conditional statement

As I continue to improve my JavaScript skills, I'm looking for guidance on optimizing the following if statement. Is there a way to shorten it, possibly even condense it into one line? How can I achieve that? onSelect: function (sortOption) { th ...

javascriptvue.jsif-statementecmascript-6

The jQuery pop-up fails to activate on the initial click

I have multiple "Buy Now" buttons for different products. If the button is labeled as "sold-out," it should not do anything, but if it's available, it should trigger a jQuery Magnific Popup. Currently, the popup only opens after the second click becau ...

javascriptjqueryhtmlmagnific-popup

Encountering an error message stating "Please enable JavaScript to run this application" when making React API calls after deploying a ReactJs app on the Firebase server

I'm currently working on a React JS app that calls various APIs. The backend of this application is a NodeJs server deployed in GCloud. While everything runs smoothly when I test the React app locally, I encountered an issue after deploying it to Fir ...

javascriptnode.jsreactjs