Hi,
I've been trying a lot of options to manage an exception and show an error at admin panel but nothing seems to work.
I'm at the postProcess method of a custom module. After the user sends a csv file through a form and the data is checked (everything works fine here), if an exception occurs I need to show a message, stop and redirect to the same page.
I've tried this:
this->get('session')->getFlashBag()->add('error',$msg);
Tools::redirectAdmin('index.php?controller='.$controller.'&token='.$token);
this:
header("HTTP/1.0 400 Bad Request");
die(json_encode(array( 'error' => array($this->l(' Error') ))));
(that one works but shows a blank page with the message, not the message inside the admin panel)
also this:
$this->context->smarty->assign(array(
'token' => Tools::getAdminTokenLite('AdminModules'),
'errors' => $this->errors
));
$this->setTemplate('ExcelProcess.tpl');
and {$errors|var_dump} at the tpl displays null...
... and many other options.
I can't find anything either about backoffice custom notifications at the PS docs, only about front custom notifications.
Any clue?
Thanks a lot!
Miguel
PostProces code: https://drive.google.com/file/d/175nhUPDlzi6T8rZjjE8Desnzq-mtYzNQ/view?usp=sharing
Tpl code: https://drive.google.com/file/d/17EONOCJ60L4Gp_GidzvwCQwMyTrRXapF/view?usp=sharing
Adding an error in postProcess() can be achieved by setting
$this->errors[] = $this->l('My error');
or
$this->context->controller->errors[] = $this->l('My error');
during your form submission checks.
Form will be rendered with your error messages into a red box.
If you want to show an alert without reloading the page instead, you'll have to perform an AJAX call to your AdminController, get back a JSON response and render your error message as a result of the execution of the call.
See offical docs
Is there a way to disable the error overlay when running a create-react-app in development mode?
This is the overlay I'm talking about:
I'm asking this because im using error boundaries (React 16 Error Boundaries) in my app to display error messages when components crashes, but the error overlay pops up and covers my messages.
An alternate solution is to add the following CSS style:
iframe
{
display: none;
}
This prevents the error from showing.
We don't provide an option to disable the error overlay in development.
Error boundaries do not take its place (they are meant for production use).
There is no harm having both the development error overlay and your error boundary; simply press Escape if you'd like to view your error boundary.
We feel the error overlay provides tremendous value over your typical error boundary (source code, click to open, etc).
It is also vital as we explore enabling hot component reloading as a default behavior for all users.
If you feel strongly about disabling the overlay, you'll need to eject from react-scripts and discontinue use of webpackHotDevClient. A less intrusive method may be removing the error event listener installed by the overlay off of window.
The error overlay can be disabled by using the stopReportingRuntimeErrors helper utility in the react-error-overlay package.
First, install the react-error-overlay package:
yarn add react-error-overlay
Then in index.js — right before mounting the root React component, import the utility and invoke it like this:
import { stopReportingRuntimeErrors } from "react-error-overlay";
if (process.env.NODE_ENV === "development") {
stopReportingRuntimeErrors(); // disables error overlays
}
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById("root")
);
Error overlays in create-react-app should now be disabled.
You can suppress React's error event handling by capturing the event first.
for example, by placing in public/index.html's <head>:
<script>
window.addEventListener('error', function(e){
// prevent React's listener from firing
e.stopImmediatePropagation();
// prevent the browser's console error message
e.preventDefault();
});
</script>
Since you probably still want React's error overlay for errors outside the error boundary, consider this option:
<script>
window.addEventListener('error', function(e){
const {error} = e;
if (!error.captured) {
error.captured = true;
e.stopImmediatePropagation();
e.preventDefault();
// Revisit this error after the error boundary element processed it
setTimeout(()=>{
// can be set by the error boundary error handler
if (!error.shouldIgnore) {
// but if it wasn't caught by a boundary, release it back to the wild
throw error;
}
})
}
});
</script>
assuming your error boundary does something like:
static getDerivedStateFromError(error) {
error['shouldIgnore'] = true;
return { error };
}
The result is a behaviour that follows try...catch line of reasoning.
To solve this issue, you could use CSS:
body > iframe {
display: none !important;
}
for some reason the overlay popped up for me only now while upgrading to Webpack 5.
In any case, you can now cancel the overlay by adding in your webpack.config.js:
module.exports = {
//...
devServer: {
client: {
overlay: false,
},
},
};
Or through the CLI: npx webpack serve --no-client-overlay
Taken from here: https://webpack.js.org/configuration/dev-server/#overlay
To avoid bundling in this large dev library in prod you can use a
dynamic import:
yarn add react-error-overlay
if (process.env.NODE_ENV === 'development') {
import('react-error-overlay').then(m => {
m.stopReportingRuntimeErrors();
});
}
In config/webpack.config.dev.js, comment out the following line in the entry array
require.resolve('react-dev-utils/webpackHotDevClient'),
And uncomment these two:
require.resolve('webpack-dev-server/client') + '?/',
require.resolve('webpack/hot/dev-server'),
I think this makes sense but sometimes when you are typing and have an error boundary then the overlay pops up with each character stroke and is annoying. I can remove the handler I suppose.
In the file webpack.config.js, comment the line:
// require.resolve('react-dev-utils/webpackHotDevClient'),
And uncomment:
require.resolve('webpack-dev-server/client') + '?/',
require.resolve('webpack/hot/dev-server'),
In the file webpackDevServer.config.js, comment:
// transportMode: 'ws',
// injectClient: false,
hide it with adblock
It is very useful to disable the errors temporarily so you don't have to comment/uncomment parts of your code that is not used at the moment, but it definitely will be after a few more changes.
The quickest solution is to just use adblock to pick the iframe with the errors.
It is trivial to toggle it with a single click to enable / disable adblock on the given page.
It is counter-intuitive to overlay the rendered page in development mode just to inform the user the newly imported objects or the recenlty created variables are not yet used.
I would say it is an arrow to the knee for beginners :)
If you are using the latest version with react-script >= 5.0.0, you just need to add an environment variable ESLINT_NO_DEV_ERRORS=true.
https://create-react-app.dev/docs/advanced-configuration
There is no option for it.
But, if you strongly wanted to disable modal window, just comment out this line
https://github.com/facebook/create-react-app/blob/26f701fd60cece427d0e6c5a0ae98a5c79993640/packages/react-dev-utils/webpackHotDevClient.js#L173
I had the same problem and I have been digging in the create-react-app source for a long time. I can't find any way to disable it, but you can remove the listeners it puts in place, which effectivly stops the error message. Open the developerconsole and select the html tag. There you can remove the event listeners on error and unhandlerejection which is put in place by unhandledError.js. You can also close the error message by clicking the x in the upper right corner of the screen, and then you should see your message.
Gathering answers here together, I managed to solve this issue for myself.
Here is the package I created for this.
The css fix has changed:
body > hmr-error-overlay {
display: none;
}
I'll also recommend adding this block on init so that you don't get silent errors:
window.addEventListener('error', function (e) {
console.error(e.message);
// prevent React's listener from firing
e.stopImmediatePropagation();
// prevent the browser's console error message
e.preventDefault();
});
My script has some syntax error but instead of showing the error, PhantomJS doesn't display anything. Why Phantom JS isn't showing parse error if he script has errors?
In the following PhantomJS script (running via windows CMD), phantomJs hangs instead of showing error if there is a parsing error in the script.
var system = require('system');
var webpage = require('webpage').create();
console.log('starting script');
if (system.args.length === 0) {
console.log('no args');
} else {
system.args.forEach(function(arg,index){
console.log('arg is '+arg+' at '+index);
});
}
webpage.open('http://localhost:3000/cookie-demo',function(status){
if (status === 'success'){
console.log('success in opening page');
phantom.cookies.forEach(function(cookie,index){
for ( var key in cookie){
/*if instead of index, I use i as variable (undefined), the script just hangs!*/
console.log('[cookie:'+index+']'+key+'='+'cookie[key]');
}
});
phantom.exit(0);
}
else{
console.log('could not open the page');
phantom.exit(1);
}
});
If there is no syntax error in the script, I get following output
C:\Users\Manu\Documents\manu\programs\random>phantomjs --cookies-file=cookie-jar.txt phantomTest.js
starting script
arg is phantomTest.js at 0
success in opening page
[cookie:0]domain=cookie[key]
[cookie:0]expires=cookie[key]
[cookie:0]expiry=cookie[key]
[cookie:0]httponly=cookie[key]
[cookie:0]name=cookie[key]
[cookie:0]path=cookie[key]
[cookie:0]secure=cookie[key]
[cookie:0]value=cookie[key]
[cookie:1]domain=cookie[key]
[cookie:1]expires=cookie[key]
[cookie:1]expiry=cookie[key]
[cookie:1]httponly=cookie[key]
[cookie:1]name=cookie[key]
[cookie:1]path=cookie[key]
[cookie:1]secure=cookie[key]
[cookie:1]value=cookie[key]
But if there is a syntax error, I see nothing on the console and it doesnt exit
C:\Users\Manu\Documents\manu\programs\random>phantomjs --cookies-file=cookie-jar.txt phantomTest.js
PhantomJS version 2.0 and 2.1 will silently fail and hang if there are syntax errors. Use versions 1.9.8 or 2.5 betas. All downloads are here: https://bitbucket.org/ariya/phantomjs/downloads/
Better still migrate to Puppeteer which is a project with very similar API that uses headless Google Chrome underneath.
We have a system where customer information is editable in-line.
When someone puts in an email that already exists, I want to return the error message:
Email already exists. <a href='/find-duplicates/id'>Click here to find possible duplicates of this customer</a>
I would like the user to be able to click on the link when s/he sees the error message. The error message is very easy to send; it's rendering the html that's the problem.
Trying to display same kind of link in x-editable field error as #iateadonut.
For anyone wanting to display html in x-editable errors, assuming you have the error with html sent back from server with response status code different from 500 (400 maybe) try :
$(function() {
$('#your_field_id').editable({
error: function(response, newValue) {
if(response.status === 500) {
return 'Service unavailable. Please try later.';
} else {
var error = $.parseHTML( response.responseText )
$(".editable-error-block").html(error)
}
},
});
})
Mostly html parsing response error and injecting it inside x-editable error block.
Found in x-editable doc, options.
This question is mostly particularly about phpunit_selenium2 extension (though the general ideas are welcome as well):
Let's say I have a page that fires an alert on the browser/tab closing event with something like this:
window.onbeforeunload = function() {
return 'Hello world!';
};
The test opens this page, performs some actions and according to the test scenario I need to open another url.
The issue is that the command
$this->url('/another/page/url');
waits for the page url to be changed and fails because it doesn't - since it's locked by the just appeared alert window: RuntimeException: Navigation failed with error code=3.
How would one solve that?
The ugly but the only solution I could think of:
try {
$this->url('/another/page/url');
} catch (RuntimeException $e) {}
$this->acceptAlert();