I am trying to add Universal Linking to a Cordova App using the ionic-plugin-deeplinks plugin.
According to this issue query parameters should work out of the box.
Universal Links for me work correctly except for links with query parameters.
Eg. https://my-site.com/?olddeeplinking=resetpassword&token=123
When I click on the link in an email the queryString field is always an empty string.
Am I missing something, do I need to enable the plugins to detect query params?
Here is the code that I'm using:
const deepLinkRoutes = {
'/user/login': {
action: 'showLogin',
resetUrl: '/',
},
'/user/forgot-password': {
action: 'showForgotPassword',
resetUrl: '/',
},
...
};
export const _getIonicRoutes = () => Object.keys(deepLinkRoutes)
.reduce((links, route) => {
links[route] = { target: '', parent: '' };
return links;
}, {});
export const handleUniversalLinks = () => {
const ionicRoutes = _getIonicRoutes();
const sy = obj => JSON.stringify(obj);
const matchFn = ({ $link, $route, $args }) => {
console.log('Successfully matched route', $link, $route, $args);
alert(`Successfully matched route: ${sy($link)}, ${sy($route)}, ${sy($args)}`);
return history.push($link.path);
};
const noMatchFn = ({ $link, $route, $args }) => {
console.log('NOT Successfully matched route', $link, $route, $args);
alert(`NOT Successfully matched route: ${sy($link)}, ${sy($route)}, ${sy($args)}`);
return history.push($link.path);
};
window.IonicDeeplink.route(ionicRoutes, matchFn, noMatchFn);
};
UPDATE:
It looks like the intent received on Android is always /user/login even though the Universal Link does not have it. What could be causing that?
2019-10-21 17:22:47.107 30389-30389/? D/MessageViewGestureDetector: HitTestResult type=7, extra=https://nj.us.gpd.my_company-dev.com/user/login
2019-10-21 17:22:47.139 1128-1183/? I/ActivityManager: START u0 {act=android.intent.action.VIEW dat=https://nj.us.gpd.williamhill-dev.com/... cmp=us.my_company.nj.sports.gpd/.MainActivity} from uid 10147
A clue:
It looks like the deeplinks plugin is using window.location.href to detect the query parameter.
Since I am using cordova-plugin-ionic-webview the href is always the alias used for localhost of the Ionic engine serving the App contents, so the query parameters are never found.
Deeplinks plugin code:
https://github.com/ionic-team/ionic-plugin-deeplinks/blob/master/src/browser/DeeplinkProxy.js#L40
function locationToData(l) {
return {
url: l.href,
path: l.pathname,
host: l.hostname,
fragment: l.hash,
scheme: parseSchemeFromUrl(l.href),
queryString: parseQueryStringFromUrl(l.href)
}
}
onDeepLink: function(callback) {
// Try the first deeplink route
setTimeout(function() {
callback && callback(locationToData(window.location), {
keepCallback: true
});
})
// ...
}
This is the problem, not sure on the solution yet though.
Related
I'm trying to create a playwright test (in javascript) that uses the page object model of classes, but where the test and page object model aren't in the same directory path.
The problem I'm having is it can't find my page-object-model class file. The error is Error: Cannot find module './pom/home-page'. What am I missing or doing wrong?
My file setup and path structure are as follows:
/package.config.js
...
const config = {
testDir: './test/playwright',
...
/test/playwright/pom/home-page.js
const { expect } = require ('#playwright/test');
exports.HomePage = class HomePage {
constructor(page) {
this.page = page;
this.searchInput = page.locator('#searchInput');
this.searchButton = page.locator('#searchButton');
}
}
/test/playwright/scripts/home/search.spec.js
const {test, expect} = require('#playwright/test');
const {HomePage} = require('./pom/home-page');
test.beforeAll( async ({ page }) => { ... });
test.beforeEach( async ({ page }) => { ... });
test.afterAll( async ({ page }) => { ... });
test.describe( 'As a user I want to search', () => {
test('"mySearchTerm1" and return {the expected result}', async ({ page }) => {
const homePage = new HomePage(page);
...
});
test('"mySearchTerm2" and return {the expected result}', async ({ page }) => {
const homePage = new HomePage(page);
...
});
});
Those using TypeScript can simplify this using tsconfig.json
https://playwright.dev/docs/test-typescript#manually-compile-tests-with-typescript
in tsconfig add:
"baseUrl": ".",
"paths":{
"#pages/*":[
"/test/playwright/pom/*"
]
}
Then you can import it in your fixture or test file like this:
import { HomePage } from "#pages/home-page"
This can be used to shorten fixtures or other files.
So, apparently the file reference is relative to the directory the test is located, not the testDir directory defined in the config file. I need to change line 2 in search.spec.js
const {HomePage} = require('../../pom/home-page');
I want to make API (Get & Post) requests to an API build with Yii2 using Electron.
I have tried Axion, Fetch, HTTP, request modules and all of them gave me the same error:
data: {
name: 'PHP Notice',
message: 'Undefined index: username',
code: 8,
type: 'yii\base\ErrorException',
file: 'C:\xampp\htdocs\app\controllers\ApiController.php',
line: 898,
'stack-trace': [Array]
}
Here is the code for the action I want to call:
public function actionLogin(){
if(Yii::$app->request->isPost){
Yii::$app->response->format = Response::FORMAT_JSON;
$data = Yii::$app->request->post();
$username = $data['username'];
$password = $data['password'];
$device_token = $data['device_token'];
$prefix = substr($username, 0, 3);
$model = null;
}
}
And here is the code in Electron:
axios.post('http://localhost:8080/app/api/login', {
username: 'Fred',
psssword: 'Flintstone'
})
.then(function (response) {
console.log(response);
});
For some reason, the parameters are not passing to the action.
I have tried a lot of ways and this one seems to be the simplest.
P.S. all of the way I have tried gave the same error.
I have found the solution for this issue, the way it worked was:
const login = async(username, password)=>{
const data = new URLSearchParams();
data.append('username', username);
data.append('password', password);
data.append('device_token', 'null');
await fetch(`http://localhost:8080/app/api/login`,{
method: 'post',
body: data
})
.then(res => res.json())
.then(data => {
if(data.status){
ipcRenderer.send('user:login', data.data.user_type, data.data.access_token);
}
else{
document.querySelector('#message').innerText = 'Wrong password or username';
document.querySelector('#message').style.display = 'block';
}
})
}
I want to test my Electron application but I feel this is harder than I expected!
Just a simple thing as using the open file dialog seems impossible from what I've seen when I looked around a while!
Is it at all possible, or can I mock this behavior somehow?
My application adds the selected files to a file list and shows some result in a grid. If I can't open files I wont get the grid and can't test if it behaves as expected.
How should I approach this issue if I can't use the file dialog?
This is my test setup:
import { Application } from "spectron";
import { expect } from "chai";
describe("Application", function() {
this.timeout(10000);
let app: Application;
let browser: any;
before(async () => {
app = new Application({
path: electronPath,
args: [appPath],
});
await app.start();
browser = app.client;
await browser.waitUntilWindowLoaded();
});
after(() => {
await app.stop();
});
it("Starts application", async () => {
const count = await browser.getWindowCount();
expect(count).to.equal(1);
});
it("should add files", async function() {
await browser.click("#block-container > div.button-row > div:nth-child(1) > button:nth-child(1)");
// ???
});
});
And this is the addFiles method:
public addFiles() {
const selectedFiles: string[] = this.electronService.remote.dialog.showOpenDialogSync({
title: "Add files",
properties: ["openFile", "multiSelections"]
});
...
}
I'm working on a project that uses Rails and React, with react-router version 4.2.0 and react-router-redux 5.0.0-alpha.9. It's the first time I use React and I'm having trouble routing.
In my routes.jsx file I have the following path:
const routes = [
{ path: /\/events\/(\d)$/, action: () => <EventForm /> },
];
When I type http://localhost:3000/events/2 in my browser I get the content back.
I want to modify my route so this link won't be valid unless there's a userToken appended to it as a query string. (I know this is not the best security practice but it's valid for the purpose of this project)
For example, the following link http://localhost:3000/events/2 should not work, but the link http://localhost:3000/events/2?userToken=abc should work.
I tried these options but it didn't work:
{ path: /\/events\/(\d)\?userToken\=(\w)$/, action: () => <EventForm /> }
{ path: /\/events\/(\d)\?userToken=[\w]$/, action: () => <EventForm /> }
Thanks!
One way is to check url param in componentDidMount lifecycle method of EventForm:
class EventForm extends Component{
componentDidMount(){
const {location, history} = this.props // these are by design in props when using react-router
if(!location.query.userToken){
history.push('/login') // or whatever route
}
}
render(){
return (<div>...</div>)
}
}
export default EventForm
I'm using the following router in my app:
app.Router = Backbone.Router.extend({
// define the route and function maps for this router
routes : {
"" : "showLogin",
// Sample usage: http://ServerManager/
"login" : "login",
// Sample usage: http://ServerManager/#login
"logout" : "logout",
// Sample usage: http://ServerManager/#logout
"folders" : "listFolders",
// Sample usage: http://ServerManager/#folders
"folders/:name" : "showFolder",
// Sample usage: http://ServerManager/#folders/System
"*other" : "defaultRoute"
// Sample usage: http://ServerManager/#badHash
},
showLogin : function() {
console.log("Home page loaded. Redirecting to #login page.");
this.navigate("login", {trigger: true, replace: true});
},
login : function() {
//console.log("login route fired");
// delete sessionStorage items and load a new loginview
this.changePage(new app.LoginView());
},
logout : function() {
//console.log("logout route fired");
// Clear the token and other session items from sessionStorage
sessionStorage.clear();
this.navigate("login", {trigger: true, replace: true});
},
listFolders : function() {
//console.log("listFolders route fired.")
if (app.folderView === undefined) {
console.log("creating new app.folderView");
app.folderView = new app.FolderView();
}
else {
console.log("using existing app.folderView");
}
this.changePage(app.folderView);
},
showFolder : function(name) {
console.log( app.router.routes[Backbone.history.fragment] );
//console.log("showFolder route fired.")
this.changePage(new app.ServiceView({folder : name}));
console.log( app.router.routes[Backbone.history.fragment] );
//app.router.navigate("folder/" + name, {trigger: false});
},
defaultRoute : function() {
alert("Error. Page doesn\'t exist.");
},
changePage : function(page) {
$(page.el).attr("data-role", "page");
page.render();
$("body").append($(page.el));
var transition = $.mobile.defaultPageTransition;
$.mobile.changePage($(page.el), {changeHash : true, transition : transition});
}
});
If I use
app.router.navigate("folders", {trigger: true, replace: true});
it successfully sends the app to server/#folders, but when I pass
app.router.navigate("folders/" + id, {trigger: true, replace: true});
it triggers the root of the app and loads my login page. I can see the correct URL (e.g. server/folders/folder1) temporarily flash before the redirect happens. Any ideas as to what's happening here?
Backbone routers expect more generic routes last.
Set-up the folders/:id route followed by the folders route.
UPDATE
Actually, after thinking about it, this may not be the case. Can you post console output? Is it calling the correct function?
Perhaps the $.mobile ... changeHash: true is conflicting. You should probably only have one of the frameworks change the url hash for you.