Nik's findings trying to run the Syncfusion catalog app

[adriatic]

i believe that this specific issue will take more than a day to resolve, so I will list some initial comments and wait for your answers to my comments, before moving to more detailed parts:

Question 1

I found many (1700+) references to "C:\work\aurelia-ui-toolkits\Syncfusion\aurelia-syncfusion-bridge\node_modules\serve-index" - as you can see in the attached Find - Results.txt file below What are these references for?

Find Results.txt

Question 2.

Do you know why is it that the Catalog app does not require specific reference to the bridge? Note: this is the key question, as without knowing the answer you really cannot build this software. (Hint - this is all documented in How to build and use aurelia kendoui plugin - right here

Question 3.

Did you compare the implementation of KendoUI button wrapper with EJ button wrapper?

I would guess that your answer is not - and if is, the subsequent, obvious question is why not.

If you compare this (section from ej Button wrapper

@generateBindables('ejButton', ['contentType', 'cssClass', 'enabled', 'enableRTL', 'height', 'htmlAttributes', 'imagePosition',
'prefixIcon', 'repeatButton', 'showRoundedCorner', 'size', 'suffixIcon', 'text', 'timeInterval', 'type', 'width'])

with this matching section from KendoUI button wrapper)

@generateBindables('kendoButton')

you will realize that you are not making use of [bindables.js]() feature that is a very important one to avoid chances for missing something or making typos.

[bharathm03]

@adriatic please find my comments

Question 1. It seems to be a feature in npm, where absolute path is updated in all node_modules' package.json file. Refer the following link

https://github.com/npm/npm/issues/10393

Question 2. My understanding was samples have some hard references to relevant src files. Now I’m understanding dynamic mapping made on System.js config and role of main.js in loading plug-ins. I need to read more in the given documents and I will come back to you on this if I faced any difficulties.

Question 3. Yes i compared the Kendo Button wrapper. Current pattern of control implementation is chosen on following basis.

1. All the widget properties are listed in one single file, which creates unwanted content collection
2. Each components source is wrapped in single file which will make debugging easier.

Also, to avoid chances of missing or typos in property name. I have planned to auto generate each component source from our API document i.e., current button.js src will be auto generated. My team already using this for Angular2 support, to avoid manual syncing of APIs in every release.

Let me know your comments on this

[adriatic]

Still cannot run the app

I am leaving the existing discussion on the three issues defined above until we resolve this specific problem defined below.

My current folder is C:\work\aurelia-ui-toolkits\Syncfusion\aurelia-syncfusion-bridge

I cloned the repo to my machine and executed the following obvious commands in my console

Standard build procedure

(My current folder is C:\work\aurelia-ui-toolkits\Syncfusion\aurelia-syncfusion-bridge)

npm install
jspm install
cd sample
jspm install

All these steps went (almost) perfect (we will discuss some little issues later), but when I run

gulp watch

I get

Failed to load resource: the server responded with a status of 404 (Not Found)
undefined:1 Uncaught (in promise) Error: XHR error (404 Not Found) loading http://localhost:3000/src/root/package.json(…)

meaning that there is expectation from somewhere (gulp build most likely) that package.json is in the root folder - which should not exist.

Next problem is:

Failed to load resource: the server responded with a status of 404 (Not Found)
undefined:1 Uncaught (in promise) Error: XHR error (404 Not Found) loading http://localhost:3000/src/aurelia-syncfusion-bridge.js(…)

This indicates that the project is not modified to address my Question 3 in my yesterday's comments

I do not know whether you can run the bridge app in some other way - but would appreciate it you can make the build and run comply with the above defined "Standard build procedure".

Last comment today

Please define the Installation process as soon as possible as we all need to get the "unified access" to the vendors folder - which should not be in the actual repository - but rather in the newly created assets repository as a zip file.

Once you get that going, please let me know so I can give you more details on the wrappers and catalog application.

[karthickthangasamy]

@adriatic I hope, we followed the Aurelia compatibility plugin structure as discussed here.

_Nik: From this whole thread, the only important part is to have this section in your catalog application's index.html file -- and you do have that._

We also tried to run the skeleton-bridge-master, but we are facing the above mentioned issues. We tried the solution suggested here also. It seems, this issue related to JSPM packages. Could you please check and provide you suggestions.?

_Nik: I do not want to check things without the ability to run that code - which is why I need you to provide the complete vendors folder as this task requires. Note that this task is already 13 days old._

Thanks, Karthick T

[bharathm03]

@adriatic this seems to be one of jspm package issue, which is updated after April 11. My machine does not throws any these issues as it was setup(npm install & jspm install) by last Friday(Apr 8) and runs perfectly.

_Nik's comment: I do not understand how can you "run perfectly" the catalog application that has no access to Syncfusion SDK (collection of JavaScript ej- modules that the bridge needs?_

_Let's resolve this issue before anything else as I cannot really do anything to help you, before I can see how is the app running. By "running" I mean the ability to run the catalog app that is using the Aurelia-Syncfusion bridge's implementation of the button wrapper and to see the button appear in the catalog app as an Aurelia component. As you know this is the next step following the quick bridge developer's tutorial, which you executed successfully more than a week ago. So, I do not understand where is the disconnect and problems by adding vendors folder, adding correct code for the existing button wrapper and the correct code for the matching catalog application's button page_

_To be very specific, the current implementation of button wrapper is not correct -- see KendoUI button wrapper as the example of the correct implementation._

Regarding installation, vendors folder is not committed from our side. Currently we are investigating how to configure "amd" module for Syncfusion javascript-widget in System.js dynamic constructed module loader. We need to set the path for "jquery" and "jquery-easing" to amd module loader. Do you have any idea on this?

_Nik: I believe that we have a misunderstanding here as it seems to me that you are doing something that is already provided to you by using the gulp build task (which is executed by gulp watch task). The easiest way to recover from this situation is to ask you to read control implementation walkthrough and to discuss this until absolutely every detail is understood_

[bharathm03]

@adriatic We further worked on it to find the root cause of the build failure and the issue you mentioned in this comment is related to latest browserSync version "2.12.3", when I set the browserSync version to "2.11.2", bridge is working fine.

Please refer the related issue link below : https://github.com/BrowserSync/browser-sync/issues/1063

Regarding vendors folders, we have committed the required files and now it is in working status

[bharathm03]

@adriatic can you give us your comments and suggestion for completed controls?

[karthickthangasamy]

Syncfusion Aurelia components implemented and catalog application created for all Syncfusion-JavaScript widgets.