Any way to get meaningful errors in Ember CLI? - ember.js

I'm using Ember CLI and I have a problem in my code which is related to computed aliases and model relationships. I'm not able to debug this problem as I'm getting messed up errors like this:
"EmberError#http://localhost/assets/vendor.js:22707:15
Ember.default.assert#http://localhost/assets/vendor.js:15408:13
ember$data$lib$system$store$finders$$_find/<#http://localhost/assets/vendor.js:63941:9
tryCatch#http://localhost/assets/vendor.js:55993:16
invokeCallback#http://localhost/assets/vendor.js:56005:17
publish#http://localhost/assets/vendor.js:55976:11
#http://localhost/assets/vendor.js:37026:7
Queue.prototype.invoke#http://localhost/assets/vendor.js:11432:11
Queue.prototype.flush#http://localhost/assets/vendor.js:11497:13
DeferredActionQueues.prototype.flush#http://localhost/assets/vendor.js:11302:13
Backburner.prototype.end#http://localhost/assets/vendor.js:10727:11
Backburner.prototype.run#http://localhost/assets/vendor.js:10782:15
executeTimers#http://localhost/assets/vendor.js:11164:7
updateLaterTimer/backburner._laterTimer<#http://localhost/assets/vendor.js:11153:11
"
Is there any way to get nicer errors? Even plain javascript exceptions would be better than this.
I have this in the console:
"DEBUG: -------------------------------" vendor.js:15442:4
"DEBUG: Ember : 1.12.0" vendor.js:15442:4
"DEBUG: Ember Data : 1.0.0-beta.17" vendor.js:15442:4
"DEBUG: jQuery : 1.11.3" vendor.js:15442:4
"DEBUG: -------------------------------"
... Some deprecations messages from Ember Data that is irrelevant
"Ember Inspector Active"
... The error above

You are looking at an ember app that has been built for production...
To debug the app run ember server
You will then get source mapped output

I'm having the exact same issue, and to be honest I don't think there's a way to get better stack traces.
Your best bet is to try and add breakpoints using debugger; where you have a hunch the error is unfolding, and then inspecting the code at run time.

I think this problem is because a bug on Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=670002 . On my development environment, the console.log show the vendor.js line number (non-desired), but through debugging I see the sources of my project.
Have you tried to debug the sources? In the debugger tab it should show all your application files and some from different addons. I've got ember 2.4.4.

Related

ember-electron application start (code hierarchy)

I'm trying to move a very old 2.x ember-electron application to new electron with ember-electron and got application window with blank screen and error in console:
(node:9061) electron: Failed to load URL: serve://dist/ with error: ERR_FILE_NOT_FOUND
The calling file ../new-ember-electron/electron-app/src/index.js has lines from old applications:
const emberAppLocation = 'serve://dist';
mainWindow.loadURL(emberAppLocation);
File ../new-ember-electron/app/router.js has:
this.route('index', { path: '/' }, function() {}
Files ../new-ember-electron/app/routes/index.js, ../new-ember-electron/app/controllers/index.js and ../new-ember-electron/app/templates/index.hbs also exist.
So, it's unclear what exactly is not found and how to find a more detailed error (application developer console doesn't have errors). But if to change the mentioned 2 lines in ../new-ember-electron/electron-app/src/index.js to:
const emberAppLocation = '../app/index.html';
mainWindow.loadFile(emberAppLocation);
then application shows content of the correct file, despite nothing working in it, even <LinkTo>...</LinkTo> is not treated as a link.
Would you please help me to understand how an ember-electron application should be structured and which way is called for the recent versions?
Used versions: node - 16.14.0, electron: 17.0.1, ember-cli: 3.28.5, ember-electron: 3.1.0, OS: darwin x64.
Thank you.
Thank you, jacobq, I've looked at your example and used emberAppUrl to start from ember-dist/index.html file. After few more changes related to require/requireNode (fixed with webPreferences options in mainWindow) the app rendered index.html file. But a problem with app location happens again right on {{ content-for "body" }} in index.html: "Uncaught Error: Cannot find module 'app-name/app'" where app-name is the application name set up as 'name' in /package.json and as 'modulePrefix' in config/environment.js. The error itself comes from /node-modules/ember-cli/lib/utilities/ember-app-utils.js, 'contentFor' function called with 'app-boot'. The ember-cli itself constructs the /app-name/app path. So, the question now is what exactly ember-cli expects to find during the boot with the new structure? Or maybe some config variable should be added to let know Ember about the /app-name/app location?
Edited:
jacobq, yes, the only difference in index.html is application name: "testapp". RootURL is set in ../testapp/config/environment.js:
podModulePrefix: 'testapp/pods',
environment,
modulePrefix: 'testapp',
rootURL: process.env.EMBER_CLI_ELECTRON ? '' : '/',
locationType: process.env.EMBER_CLI_ELECTRON ? 'hash' : 'auto',
The full error:
It happens when testapp.js file is called from index.html, on code included from ember-cli:
if (!runningTests) {
require("testapp/app")["default"].create({"LOG_TRANSITIONS":true,"LOG_TRANSITIONS_INTERNAL":true});
}
First thing I'd like to plug is joining the #topic-desktop channel on the Ember.js community Discord server: https://discord.com/channels/480462759797063690/488735754139336714
(it's often easier to work things out by chatting there as there's lower latency than typically found with forum post/reply platforms)
Secondly, there are lots of breaking (but good) changes between ember-electron 2.x and 3.x, so I'd encourage you to work through the upgrade guide here: https://ember-electron.js.org/docs/guides/upgrading
That said, I suspect that the problem you're seeing is related to the change from serve:// to file://. Have a look at the demo app I just spun up here:
https://github.com/jacobq/ember-electron-demo
You can see the new emberAppURL here:
https://github.com/jacobq/ember-electron-demo/blob/cf7c5dee2cd975f8c67ed1dfc61eb717461f5b7d/electron-app/src/index.js#L13
Basically, ember-electron v3.x puts the usual dist output from ember build into <project_root>/electron-app/ember-dist/ now.
FWIW, I'm actually stuck on 3.0.0-beta.2 in my application because I am using IndexedDB and don't have migration code to deal with origin-related issues of switching to file:// scheme. I don't recommend that you use that version, but you could try it if you wanted to see if that changes the error you're encountering (because that beta still uses electron-protocol-serve).

Expo Image Picker vs RN-image picker

I am quite new to RN . I know this question is being repeated but I didn't quite get ans I was looking for there .
So my current project uses
expo for web and react-native cli for the android set up .
I want to add an image-picker to the project.
I see two options at my side .
RN-image-picker
expo-image-picker
I have some issues and some questions !!
Is RN-native-image picker comaptible with web ??
I think its not ,there are two resons I think that ,this lib uses Nativemodules, which
won't be bundled for web and its giving undefined error for NativeModules when I run with
web while it works fine on android .
Should I use expo-image-picker when I am creating a android build with react-native cli ??
The build doesn't give errors and it shouldn't ,but when I click on upload image ,app
crashes after I select image.I read the docs and github for the issue.Many people pointed
out its ram allocation issue,which can be sorted with disbaling "Dont keep activities" in
developer's option,which I haven't tried yet .
Also on web ,the following code snippet returns base64 as uri,is it default behaviour ??
I am using this code snippet for expo-image-picker,which ends up crashing app when I build app with rn cli,but doesn't seem to cause issues with expocli build.But I want to use expo for web and rn for android.
Also on web ,the following code snippet returns base64 as uri,is it default behaviour ??
const pickImage = async () => {
try{
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images,
allowsEditing: true,
aspect: [4, 3],
quality: 1,
base64:false
})
if(!result.isCancelled)return result.uri ;
}catch(err){
console.log(err) ;
}
}
So what should I do in this case,use expo-image-picker as it seems to be compatible with all platforms/both ?
Any kind of input would be helpful !!
I'm not a fan of Expo, and I don't have experience with that but I try to answer to your question that can be.
Is RN-native-image picker comaptible with web ??
You have right, the library supports only mobile devices.
Should I use expo-image-picker when I am creating an android build with react-native cli ??
From expo documentation, I read that but I know also that sometimes the rn-cli and expo has some package differences, and this answer proves that.
Expo never locks you in, you can "eject" at any time and your project will just be a typical native project with the React Native and Expo SDK packages that your app is using installed and configured.
I don't know what the exception, and maybe the solution that you put in your answer work well, but maybe is possible to have some dependency mismecc? Such as a none object on the Web app? or something like that.
Also on web ,the following code snippet returns base64 as uri,is it default behaviour ??
This looks like be an bug and this issue on github maybe can confirm my idea

Redmine_RE plugin is not saving the data

i am using the Redmine.3.1.0.Then i have installed redmine_re plugin.But when i try to save the requirement using the Redmine_re plugin i am getting the following error
NameError (undefined local variable or method `connection' for #<ReArtifactRelationship:0x800ddb0>):
lib/plugins/acts_as_list/lib/active_record/acts/list.rb:220:in `bottom_item'
lib/plugins/acts_as_list/lib/active_record/acts/list.rb:214:in `bottom_position_in_list'
lib/plugins/acts_as_list/lib/active_record/acts/list.rb:205:in `add_to_list_bottom'
lib/redmine/sudo_mode.rb:63:in `sudo_mode'
pls suggest how to resolve this error
#ste26054
I did not develop this plugin, but I think the support for redmine 3.1.0 is only partial at the moment. (And you may get other errors even after fixing this).
I believe you are getting an error because of this: Deprecate #connection in favour of accessing it via the class
And your error is related to this file:
In this method:
def scope_condition()
"#{connection.quote_column_name("source_id")} = #{quote_value(self.source_id)}
AND
#{connection.quote_column_name("relation_type")} = #{quote_value(self.relation_type)}"
end
Try to add self.class. in front of connection
You may have to repeat this for other files in the code.
If your changes are working, I would suggest you to submit a pull request on their plugin github page :)

Use Ember.set() to set the 'content' property

We have an issue that seems to be very similar to https://github.com/emberjs/ember.js/pull/9767. The error we get is the following:
Error while processing route: [route-name] Assertion Failed: You must use Ember.set() to set the 'content' property (of [route]) to 'undefined'.
So the only difference is that it complaints about 'content' instead of 'controller', and that it is trying to set it to 'undefined'. This only happens for a few users, and it seems to be mostly old Android-devices. We have managed to reproduce the error in the default browser on a device running android 2.3.4.
Does anyone have a clue to why this happens? Debugging on old android devices is a pain!
I forgot about this question on StackOverflow, and someone else in our team have committed a fix for the issue. This line of code:
return self.getJSON(self.get('dataUrl'))
.then(self.get('_modelMap').bind(self))
Have been changed to this:
return self.getJSON(self.get('dataUrl'))
.then(function(data) {
return self._modelMap(data);
})
This was done in one of our base controllers.
Handlebars was also upgraded from v1.3.0 to v2.0.0 in the same commit. Don't know if that is required for fixing the issue though.
Hopefully this can help others with the same issue :)

Debugging Ember.js errors: Error while loading route

While in any particular case there are hints and clues on how to debug an error you get, I haven't really found a general Ember strategy.
For example, a typeError while loading a route:
Assertion failed: Error while loading route: TypeError: 'undefined' is not an object (evaluating 'window.router.lander') (ignore the fact that I'm trying to access window.router.lander. It's irrelevant)
Why does Ember not tell you which route it's loading when this error happens? Or whether it happens in afterModel(), or activate()? And what's the general strategy for finding that sort of context info?
So far all I've got is adding a bunch of console.logs scattered around. For example with the error above:
1) Find all occurrences of window.router.lander in my code
2) before the first occurrence, add a console.log('is it the first occurrence?'), and after the first occurrence put a console.log('its not the first occurrence')
3) Do the same for every occurrence
4) refresh. One of the 'is it the nth occurrence?' won't have a closer, and now you know where the error happened.
For better debugging, you can enable transitions logging by create app with LOG_TRANSITIONS and/or LOG_TRANSITIONS_INTERNAL properties:
window.App = Ember.Application.create({
// Basic logging, e.g. "Transitioned into 'post'"
LOG_TRANSITIONS: true,
// Extremely detailed logging, highlighting every internal
// step made while transitioning into a route, including
// `beforeModel`, `model`, and `afterModel` hooks, and
// information about redirects and aborted transitions
LOG_TRANSITIONS_INTERNAL: true
});
Referenece: http://emberjs.com/guides/understanding-ember/debugging/
Also, you can use canary build which provide detailed error stack:
http://emberjs.com/builds/#/canary
Ember isn't particularly helpful when it comes to errors in the model hook, or the promises it returns. I'm sure I've read in one of the issues (or http://discuss.emberjs.com/ I'm not sure) that this is an open issue in which they're working.
What I do is use the Chrome Developer Tools to debug the issue (instead of just console loggin it). From my experience it's usually:
you're not returning anything in the model hook
an error inside one of the then functions on the promise the model hook returns
I hope it helps you!