I try to understand the code https://github.com/nuxt-community/adonuxt-template .
What is use() and why it not work in version 5.
How to change?
const { Ignitor } = require('#adonisjs/ignitor')
new Ignitor(require('#adonisjs/fold'))
.appRoot(__dirname)
.fireHttpServer()
.then(() => {
return use('App/Services/Nuxt').build()
})
.then(() => {
use('Logger').info('Nuxt is ready to handle requests')
})
.catch(console.error)
And how to rewrite that files to work in version 5:
https://github.com/nuxt-community/adonuxt-template/blob/master/start/app.js
https://github.com/nuxt-community/adonuxt-template/blob/master/app/Commands/NuxtBuild.js
https://github.com/nuxt-community/adonuxt-template/blob/master/app/Controllers/Http/NuxtController.js
https://github.com/nuxt-community/adonuxt-template/blob/master/app/Services/Nuxt.js
The use() method which was used to import dependencies from ioc container aka adonis-fold has been removed in v5. The alternative to that method is now ESM imports which uses #ioc prefix. Kindly follow this introductory guide https://docs.adonisjs.com/releases/introducing-adonisjs-v5-preview#esm-imports-all-the-way.
AdonisJS v5 has various breaking changes with regards to v4, also there are major changes in dev tools as well such as typescript as the first-class citizen, adonis cli is deprecated. Also AdonisJS team is expected to release upgrade guide in near future.
use () is provided by the IoC container AdonisJs (adonis-fold).
This function will try to resolve the binding or namespace defined in the Adonis config file and then fall back to the default require() function to import the package if it doesn't find anything.
Related
I'm adding unit tests to an Ionic 2.2.0 app I manage, but my Components crash at test-time when they encounter Google Analytics code. I'm using Ionic's official unit testing example as a basis, and my current progress can be seen on our public repo.
My project uses Google Analytics, which is added to the HTML and downloaded at runtime (because we have different keys for development vs production).
The code that initializes Analytics is in my main.ts, and it sets a global variable ga, which is subsequently available throughout the application.
I'm beginning the tests for the app's first page, which uses Analytics. When I run the tests, I'm met with the following error
Component should be created FAILED
ReferenceError: ga is not defined
at new MyBusesComponent (webpack:///src/pages/my-buses/my-buses.component.ts:33:6 <- karma-test-shim.js:138419:9)
at new Wrapper_MyBusesComponent (/DynamicTestModule/MyBusesComponent/wrapper.ngfactory.js:7:18)
at CompiledTemplate.proxyViewClass.View_MyBusesComponent_Host0.createInternal (/DynamicTestModule/MyBusesComponent/host.ngfactory.js:15:32)
........
This is because main.ts doesn't seem to be loaded or executed, and I assume TestBed is doing that purposefully. It's certainly better that I don't have the actual Google Analytics object, but the Component does need a function called ga.
My question, therefore, is as follows: how can I create Google Analytics' ga variable in my test configuration such that it's passed through to my components at test-time?
I've tried exporting a function from my mocks file and adding it to either the imports or providers arrays in my spec file, but to no avail.
I appreciate any advice! Feel free to check my code at our repo I linked to above and ask any followups you need. Thanks!
You declare the var ga but that is just to make TypeScript happy. At runtime, the ga is made global from some external script. But this script is not included in the test.
What you could do is just add the (mock) function to the window for the tests. You could probably do this in your karma-test-shim.js.
window.ga = function() {}
Or if you wanted to test that the component is calling the function with the correct arguments, you could just add the function separately in each test that uses the function. For example
beforeEach(() => {
(<any>window).ga = jasmine.createSpy('ga');
});
afterEach(() => {
(<any>window).ga = undefined;
})
Then in your test
it('..', () => {
const fixture = TestBed.creatComponent(MyBusesComponent);
expect(window.ga.calls.allArgs()).toEqual([
['set', 'page', '/my-buses.html'],
['send', 'pageview']
]);
})
Since you're making multiple calls to ga in the constructor, the Spy.calls will get the argument of all each call and put them in separate arrays.
I am writing a unit test case for my component.
Ember 0.12,
Ember-qunit 0.3.13
Ember-i18n: "4.1.1",
I am initialising this i18n service in via Ember initaliazers, so that i can access i18n serivces as this.i18n.t('some key'). which i am using in my component
some: computed('', {
get(){
this.i18n.t('somekey') + "Test"
}
})
My component unit test for this component fails, because i am not able to inject the i18n service. Please help me in solving it and i tried
needs: ['serivces:i18n'] it wont work because i have initialised via Intializers Issue injecting via initalizer
and the below code also wont work because i am using older version of ember-qunit (Please i don't wont to update to newest version because it affects all other test cases)
this.register('service:user-session', userSession);
this.inject.service('user-session', { as: 'userSession' });
Help me in solving in this issue , if there is a need for more clarity in the question , please do comment. Thanks
Prior to firebase 3 update our acceptance test have been running without any issues. We use the following in our beforeTest and afterTest
moduleForAcceptance('Acceptance | Dashboard | Items | Library | New', {
beforeEach() {
stubFirebase();
var ref = createOfflineRef(basicDataRef, 'https://MY-APP.firebaseio.com');
replaceAppRef(this.application, ref);
stubValidSession(this.application, {uid: 'xxxx'});
},
afterEach() {
unstubFirebase();
}
});
basicDataRef is a fixture for the test. The above code allows my to mock session following the test-helper in torii library to allow my application to correctly obtain the data needed as my firebase hieararchy is as follows:
/
+--uid
+--profile
+--otherdata
I am not testing for permission rules, just interaction to save/edit data in the application, and this has worked OK prior to firebase 3 migration. After version 3 all my test returns the following:
actual: >
false
expected: >
true
stack: >
at http://localhost:7357/assets/test-support.js:4130:12
at exports.default._emberTestingAdaptersAdapter.default.extend.exception (http://localhost:7357/assets/vendor.js:49473:7)
at onerrorDefault (http://localhost:7357/assets/vendor.js:41461:24)
at Object.exports.default.trigger (http://localhost:7357/assets/vendor.js:62212:11)
at http://localhost:7357/assets/vendor.js:63463:40
at Queue.invoke (http://localhost:7357/assets/vendor.js:10415:16)
message: >
Error: permission_denied at /xxxx/profile: Client doesn't have permission to access the desired data.
I always thought the createOfflineRef in emberfire allows us to bypass rules checking. the fact that it keeps returning permission_denied is quite perplexing. Maybe i need to re-engineer the test? Or I approach this wrongly all this time? Any input is greatly appreciated
Got to the bottom of this, and I guess I'll answer my own questions in case somebody else experience the same issue as I have.
the new firebase InitializeApp method has an additional optional parameter called name. By default, Emberfire service sets this name to be:
export const DEFAULT_NAME = '[EmberFire default app]';
However the Emberfire test helper to create firebase offline ref stubs the firebase instance with a different instance name to be:
export const DEFAULT_NAME = '[EmberFire offline test app]';
This cause my test to fail with permission denied, as the acceptance test is attempting to connect to the '[EmberFire default app]' and the stubbed offline reference is called something else.
Creating my own create-offline-ref helper substituting the DEFAULT_NAME to '[EmberFire default app]' solves the problem. I'm not sure as to what is the best practice for acceptance test as the change seems deliberate on emberfire.
so I was working with an iterator inside a service with Ember. The code worked using the old style scripts I cannot use the ES2015 style
ReferenceError: regeneratorRuntime is not defined
stuff[Symbol.iterator] = function *(){
debugger;
let properties = Object.keys(this);
for(let p of properties){
yield this[p];
}
};
I know this is because of the new '*' operator on the function. I have seen answers https://stackoverflow.com/a/28978619/24862 that describe having to load a browser-polyfill npm but I'm a little unclear how to get this to work inside the ember framework. Has anyone done this successfully? or should I just abandon until Ember supports it.
Polyfill
Babel comes with a polyfill that includes a custom regenerator runtime and core-js. Many transformations will work without it, but for full support you may need to include the polyfill in your app.
You should now include as ember-cli-babel and not as babel. Like this:
var app = new EmberApp(defaults, {
'ember-cli-babel': {
includePolyfill: true
}
}
Regenerator:
This package implements a fully-functional source transformation that takes the syntax for generators/yield from ECMAScript 2015 or ES2015 and Asynchronous Iteration proposal and spits out efficient JS-of-today (ES5) that behaves the same way.
Sources: https://github.com/babel/ember-cli-babel and https://github.com/facebook/regenerator
Perhaps your use of Babel.js needs to include the polyfill, in your ember-cli-build.js file use:
var app = new EmberApp(defaults, {
// Add options here
babel: {
includePolyfill: true
}
});
In Ember 2+, does anyone know how to get a reference to the Ember Store in order to troubleshoot Model mapping in the javascript console?
It was possible through App.__container__.lookup in Ember 1, but this doesn't exist anymore, and it's bloody hard to find documentation on this.
Thanks
If you look in your package.json, you should see a ember-export-application-global package that's installed by default (if not, install it). This will export your application not to the global App object, but to a global object that's named after your app. So you might have window.TodoList or window.ShoppingCart instead of window.App. From there you can use this line (similar to Ember 1.x.x):
AppName.__container__.lookup('service:store')
You can also do what I do and create an instance initializer for it:
export default {
name: 'store-on-app',
after: 'ember-data',
initialize(instance) {
const application = instance.container.lookup('application:main');
const store = instance.container.lookup('service:store');
application.set('store', store);
}
}
Then you can just use AppName.store.
If you don't want to install a separate package to access your app in the console, you can do it through window.Ember.Namespace.NAMESPACES. For example, something you can run in the console to find your app instance is:
var app = Ember.A(Ember.Namespace.NAMESPACES).filter(n => {return n.name === 'your-app-name'})[0];
From here, you can access the store on the app's container as explained by #GJK
var store = app.__container__.lookup('service:store');
I used this for debugging an Ember app in production which didn't have its container registered on the window. I found it out by looking through the ember-inspector source code, since it always has access to the container.
https://github.com/emberjs/ember-inspector/blob/2237dc1b4818e31a856f3348f35305b10f42f60a/ember_debug/vendor/startup-wrapper.js#L201