Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
I've used fullcalendar package in angular to show events for a month. Both date and events can be clicked and there is a function to handle both date click and event click. It works fine in desktop and android phones but the issue is in iPhone, there is a significant delay on each date/event click. After tapping on an event it takes some time to render the selection.
I have noticed that eventContent was being called every time on event click and it is called multiple times, and sometimes get the following warnings,
[Violation] 'setInterval' handler took 52ms
[Violation] 'setTimeout' handler took 66ms
[Violation] Forced reflow while executing JavaScript took 31ms
I've already tried commenting selection handling and eventContent functions but didn't notice any significant difference.
fullcalendar initialization
this.calendarOptions = {
headerToolbar: {
left: '',
right : 'prev title next'
},
customButtons:
{
prev:{
click:this.previousMonth.bind(this)
},
next:{
click:this.nextMonth.bind(this)
},
},
showNonCurrentDates: false,
fixedWeekCount: false,
views: {
dayGridMonth: { // name of view
titleFormat: {month:"2-digit"}
}
},
dayCellContent: arg => {
return arg.date.getDate();
},
aspectRatio:1.2,
height: 'auto',
unselectAuto: false,
eventColor:"white",
locale:jaLocale,
rerenderDelay:1,
initialDate: 2021-09-17,
events:this.Price,
eventContent:this.renderEvent,
select: this.handleDateSelect.bind(this),
dateClick: clickInfo => {
const calendarApi = clickInfo.view.calendar;
calendarApi.select(clickInfo.date);
},
eventClick: clickInfo => {
const calendarApi = clickInfo.view.calendar;
calendarApi.select(clickInfo.event.start);
},
datesSet: this.handleDatesSet.bind(this),
unselect: this.handleDateUnselect.bind(this)
};
Related
I have a normal electron app using React. And I wan to show a prompt before being closed.
The expected behavior is When I click on the "X" button, the window has to stay open and show the dialog before closing it so that I can choose if I really want to quit or not.
But instead, this is what happens
The electron window closes before showing the dialog. And the dialog closes on its own before i click on any button.
Here is the code included in the main.dev.ts
mainWindow.on('close',(e) => {
var choice = dialog.showMessageBox(mainWindow,
{
type: 'question',
buttons: ['Yes', 'No'],
title: 'Confirm',
message: 'Are you sure you want to quit?'
});
if(choice == 1){
e.preventDefault();
}});
I've already checked if there are some helfpul questions here on stackoverflow but found none.
Your help would be appreciated.
If you show a confirmation prompt you need to call e.preventDefault(); either way to keep the window open.
Then if they click "Yes", close the window separately.
However you get a problem where once the window closes after the user clicks "Yes" it'll trigger the close event again, causing an infinite loop. I've fixed this problem with the hasConfirmedClose variable below.
Here's what'll work:
var hasConfirmedClose = false;
mainWindow.on('close', (e) => {
if (!hasConfirmedClose) {
e.preventDefault(); // Prevent default no matter what.
var choice = dialog.showMessageBox(mainWindow, {
type: 'question',
buttons: ['Yes', 'No'],
title: 'Confirm',
message: 'Are you sure you want to quit?'
});
if (choice == 1) {
hasConfirmedClose = true;
mainWindow.close();
}
}
});
I am doing display: flex an element on button click and then display: none to the same element after some ajax calls. I am doing the integration testing for the same using Capybara with Selenium driver. The problem is that capybara detects the visibility of the element and sometimes it does not even though the element is visible. I have tried giving different wait values but still it works sometimes and sometimes it does not. Is there anyway I can rectify this? The code is as below:
ele.addEventListener('change', () => {
showSpinner(true);
ajaxCall().then(() => showSpinner(false));
}
showSpinner = (flag) => {
let spinner = document.getElementById('spinner');
if (!spinner) {
return;
} else if (flag) {
spinner.classList.add('show');
} else {
spinner.classList.remove('show');
}
};
.spinner.show {
display: flex;
}
.spinner {
display: none;
// other properties
}
In test file
choose 'radio_button' // if radio button
select 'some text', from: 'dropdown_element' // if dropdown
assert page.has_css?('.spinner', wait: 0)
This works sometimes and sometimes it does not. The element is selected or clicked. That works. But not has_css. Also I tried using assert_css but I am getting error. So how can I write the testcase for the above problem?
I solved the problem as below. I found the answer from a comment by #Thomas Walpole for this question Check element visibility that is visible for less than a second in Rails Capybara asked by me. The problem was that sometimes the ajax response was very fast and sometimes it was slow. So all I had to was to slow down the network.
// Set the latency time through selenium before the click or select and then check
// for the visibility of the element on page and then again change back the latency
page.driver.browser.network_conditions = { offline: false, latency: 2000, throughput: 789 }
choose 'radio_button' // if radio button
select 'some text', from: 'dropdown_element' // if dropdown
assert page.has_css?('.spinner', wait: 0)
page.driver.browser.network_conditions = { offline: false, latency: 0, throughput: 0 }
// continue with other tests
This worked for my problem. Feel free to improve this solution.
I have a React Native application built with Expo. On How can I add links in a Highcharts tooltip that will open on mobile's browser? I was able to pass a URL to Highcharts so that when a tooltip is clicked, that URL is opened:
return(
<View style={styles.container}>
<ChartView
onMessage={m => this.onMessage(m)}
config={config}
/>
</View>
This triggers this method to open the URL:
onMessage = (m) => {
let data = JSON.parse(m.nativeEvent.data);
Linking.openURL(data.url)
};
And the URL gets populated through a global variable window.myURL and sending the message with postMessage():
render() {
let Highcharts = "Highcharts";
let config ={
...
plotOptions: {
series: {
stickyTracking: false,
point: {
events: {
click: function(e) {
window.postMessage(JSON.stringify({'url': window.myUrl}));
}
}
}
},
},
tooltip: {
useHTML: true,
formatter: function () {
window.myUrl = extras.url;
return `<div class="text">some text</div>`;
}
};
This works well on iOS (both physical and emulator), but does not on Android (neither physical nor emulator).
I have gone through different Github issues such as onMessage not called in native code even though sent from webview( android) and react native html postMessage can not reach to WebView and they tend to suggest using some timeout on window.postMessage(). However, I see that even this does not work:
plotOptions: {
series: {
point: {
events: {
click: function(e) {
setTimeout(function() {
console.log('bla');
window.postMessage(JSON.stringify({'url': window.myUrl}));
}, 200);
}
}
}
},
},
Since even console.log() does not work, it looks to me as if the click event is not being caught by Android.
How can I make Android aware of this event so that I can go through the message and then open the URL?
The "click" event is fine. Problem is that, RN core's <WebView> implementation for Android is flawed at polyfilling window.postMessage(). This issue has been well discussed in this github issue.
So it seems the nature of problem, is RN has to polyfill the native window.postMessage for some reason, but the override didn't take place timely, causing window.postMessage calls still made to the native one.
One solution (for Android) proposed in that github issue, is simply stop using the native window.postMessage, and directly use the internal interface, which is the actual polyfill function.
// in place of `window.postMessage(data)`, use:
window.__REACT_WEB_VIEW_BRIDGE.postMessage(String(data))
One heads-up though, this API is not public and might be subject to change in future.
I have the following plunker working with save/restore and localStorage:
http://plnkr.co/edit/Ad12QG1uKFEf38aOtpaL?p=preview
I can save the grid state, adjust some columns (like column resize, move, etc), and then restore back to the saved grid state just fine.
Once I've saved it though, how would I go about making a "reset" function work? I want to reset it to the default state of my grid before there were any saved changes.
My attempt, which so far is unsucessfull. I'm assuming I would try to save the default state on load before the restore occurs...
onRegisterApi: function(gridApi) {
$scope.gridApi = gridApi;
$scope.defaultState = $scope.gridApi.saveState.save();
...
...and then restore similar to the $scope.restoreState function...
$scope.resetState = function() {
$scope.gridApi.saveState.restore($scope, $scope.defaultState);
}
...but that's throwing errors.
I was able to get it to work. Here's a functioning example:
http://plnkr.co/edit/Ad12QG1uKFEf38aOtpaL?p=preview
I took the same approach I outlined in my question, but I had to wrap the defaultState in a $timeout() because the state isn't immediately available within onRegisterApi without that timeout. I just made sure to make it occur before the restoreState timeout.
onRegisterApi: function(gridApi) {
$scope.gridApi = gridApi;
$timeout(function() {
$scope.defaultState = $scope.gridApi.saveState.save();
}, 50);
$timeout(function() {
$scope.restoreState();
}, 100);
},
I'm not that familiar with angular yet, so I'm sure someone could improve this.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I've been trying to social features to my app, recently working on sending tweets, I created a twitter application and trying to use birdhouse.js. I get "authorize application" popup, when I click it I get forwarded to another page that displays a pin "from twitter", but no tweets are sent :(
My code is below:
Ti.include('lib/birdhouse.js');
//create your twitter session and post a tweet
function postToTwitter() {
var BH = new BirdHouse({
consumer_key : "*****************",
consumer_secret : "*****************",
});
if (!BH.authorized) {
//call the birdhouse authorize() method
BH.authorize();
} else {
message = 'test test test';
BH.tweet(message, function() {
alertDialog = Ti.UI.createAlertDialog({
message : 'Tweet posted!'
});
alertDialog.show();
});
}
}
var buttonTwitter = Titanium.UI.createButton({
width : 280,
height : 35,
top : 375,
left : 20,
title : 'Send Via Twitter'
});
buttonTwitter.addEventListener('click', function(e) {
postToTwitter();
});
win1 = Ti.UI.createWindow({
height : '480',
width : '100%',
});
win1.add(buttonTwitter);
win1.open();
Have u tried this code
https://github.com/aaronksaunders/test_social
thanks