OWA generator improvement

quite silly mistakes, but Wow its working now !! :heart_eyes: Thanks !

For the search component, I recommend trying to implement a clone of the coreapps version.

In general, I recommend getting input from the community about exactly which components are actually going to be useful before getting too far along with implementation.

@pascal Ok, i will try to engage the community tomorrow !!

I have few doubts,

  1. by mentioning the ‘clone of the coreapps version’, do you want say that our patient search component should contain exactly the same attributes as present here ? i.e these attributes :

  1. I have implemented the component which searches according to the name, so further i have an idea to enable the searching according through uuid also (this can be achieved by setting a condition in the controller which will split the whole string though “-” and will check the numbers though (NaN) function. then accordingly, rest calls can be applied to it ). So, will that be a good idea ?

  2. I also want to know that according to you what components must be designed apart from the patient search component ? Because according to the project wiki, only login and patient search components are mentioned there and as per the comments of @darius on the proposal, login component will not be valuable to implement. So, I can devote my time in designing some more valuable components. Your views on this will be valuable !!

  1. Yes, and the look and feel should be the same too.
  2. I can’t think of a reason why a user would search for a patient using a UUID. They would use a name or a patient identifier.
  3. We’ll need input from the community on this. If we don’t get any good feedback we can reassess.

I have started a talk here !!

@pascal Hii !

We have discussed about the components here : New AngularJS Components for OpenMRS

I will be waiting for your opinion on this once you go through the conversations !! :slight_smile:

Okay. I’m traveling at the moment, but I had a quick look. Definitely follow @dkayiwa’s advice.

For configuration, I would make the components configurable by the developer when they add it to their app, not by the end user. Also, make sure to write tests for your components if you haven’t already.

Ok @pascal !! According to dkayiwa’s advice, I will complete the “Observation, Encounter, and Provider search widgets” within next 3 to 4 days i.e before friday and then I will start writing the tests. Most probably, I will be submitting the tests at the end of the next week !! :slight_smile:

1 Like

I thought you were writing tests first? TDD :smile:

1 Like

@dkayiwa Oops !! Sorry was unaware of the fact. I was just going according to my draft proposal ignoring the order of the steps mentioned in the project wiki !! No worries, I will now move further with this strategy and if you need the components quickly, I will try to complete all the above mentioned tasks before (or at) the end of this week !! :slight_smile:

1 Like

@pascal @dkayiwa Hii

I have been writing tests for the components using mocha and chai. While testing the tests through the “npm test”, I faced an error “unresolved symbol import” which was resolved by introducing babel-registers which helps in recognizing the ES6 syntax. After that I got stuck at an error “ReferenceError: window is not defined”. I resolved this error by using “jsdom” and now again I am stuck at an error which is “ReferenceError: angular is not defined”.

Any idea about this error ??

I could have setup karma with mocha but I am wondering that is it not possible to make angular work only in a mocha babel and jsdom environment ? or i should just go with the karma test runner ?

My recommendation is to use the same testing setup as our flagship OWA, the concept dictionary. Which repo/branch can we check out to reproduce this?

Thanks ! I have already setup the jasmine and karma environment. Was getting an error “webpackJsonp is not defined” but now its resolved !

@pascal Hii

Done with the implementation of all the four components as suggested by @dkayiwa. I have implemented the tests for all the four components i.e patient, encounter, observation and provider search. A simple hello test is also included there.

Attributes present in the component is almost same as you suggested previously. For writing tests, I used karma and jasmine setup. Everything is as per the ES6 syntax.

You can check my work at :

I have downgraded the angular dependencies because I was facing some unknown errors like “transition superseded” and “angular.module is not a function”.

But everything is running great in these versions of the angular dependencies !!
I will update the generator soon !

Thanks !

Okay cool. Is there also a PR? I’ll try to look at the app sometime in the next few days.

Okay !! This is the link to the PR (where components and tests are scaffolded into the generator) :

Its a combined PR for everything.

Note : After scaffolding the webapp, make sure to run the following dependency commands, otherwise there will be a “transition superseded” error.

npm i --save angular@1.5.5 npm i --save angular-animate@1.5.5 npm i --save angular-resource@1.5.x npm i --save angular-route@1.5.x npm i --save angular-ui-router@0.3.0 npm i --save angular-translate@2.15.2 and npm i --save-dev angular-mocks@1.5.3

Added the functionality of loading during the REST Calls for better user experience !! Updated the above PR !!

1 Like

Are we asking the user to run seven different npm commands after they scaffold an app? I don’t think that’s acceptable. If we need to fix the various angular versions can’t we just do that in package.json?

I already did that. I can’t run “–save” or “–save-dev” command inside the generator hence, I placed all the required dependencies in the “_package.json” in the app of the generator so that it provides the user with all the dependencies once app is scaffolded. If you have tried scaffolding the app, you might have seen that.

But, still it throws errors. There is no build errors and also no errors in the browser console. The errors are only when we run “npm test”. And Once we run the above dependency commands, the tests end with success. It took it me a whole day just to find the solution to those unknown errors and then I tried running these commands manually, and it worked. Still searching for it why is this happening.

At the time of the previous message, I was unware of the dependencies which were causing those errors that’s why I suggested you to run all the dependency commands so that you can check my work without errors. It was just temporary.

At present after some experiments, I will reduce those commands to only three i.e.

npm i --save angular@1.5.5 npm i --save angular-route@1.5.x npm i --save-dev angular-mocks@1.5.3

and removing “angular-route” and “angular-mocks” from the dependencies will also not affect the tests. So, at the end at least we have to run the below angular command to make it work :

npm i --save angular@1.5.5

Still it must work without these commands because it might be a small issue for us but for the users, it will be a big problem as they would not be able to find the solution for it.

I was about to take suggestions from you on this but didnt wanted to disturb you on the weekends !!

Yes, we’ll need to understand the root cause of this issue. The app that gets scaffolded needs to work correctly without the user having to manually run npm, especially since npm install is run as the final step in the scaffolding process.

I’ll take a look this evening and see what I can find.