data visualizer app

تطبيق مرشح البيانات والمكون الإضافي

هذا عبارة عن ريبو يحتوي على تطبيق البيانات المرئي والمكون الإضافي المستخدم داخليًا ومصممًا كنقطة إدخال منفصلة بحيث يمكن استخدامها في تطبيقات أخرى مثل تطبيق لوحة القيادة

ابدء

لتشغيل تطبيق البيانات المرئية من دليل جذر REPO ، قم بتثبيت التبعيات:

 $ yarn install

تطوير

قم yarn start من جذر الريبو لبدء التطبيق على localhost:3000 والمكون الإضافي على localhost:3001 .

يتيح تشغيل البرنامج المساعد على منفذ مختلف اختباره في تطبيقات أخرى. على سبيل المثال ، لاختباره في تطبيق Dashboard ، قم بتشغيل تطبيق Dashboard في منفذ مختلف وعبر DevTools يتجاوز مسار البرنامج المساعد مع المضيف والمنفذ حيث يتم تشغيل البرنامج المساعد. خطوات مثال:

1. في DV: yarn start
2. في لوحة القيادة: yarn start في هذه المرحلة على DV على LocalHost: 3000 ، البرنامج المساعد DV على LocalHost: 3001 وتطبيق لوحة القيادة على LocalHost: 3002.
3. أشر المتصفح إلى المضيف المحلي: 3002.
4. أضف هذا الإدخال إلى تطبيق Dashboard LocalStorage عبر DevTools في علامة تبويب التطبيق: dhis2.dashboard.pluginOverrides: { "VISUALIZATION": "http://localhost:3001/plugin.html" }

مع نفس المبدأ ، من الممكن اختبار العديد من الإضافات في نفس الوقت ، فأنت بحاجة فقط إلى التأكد من أن المنفذ الذي تم تكوينه في التجاوز هو المساعد المناسب الذي تتجاوزه.

يمكن تشغيل كل البرامج النصية التالية من NPM من دليل جذر الريبو:

اختبارات الوحدة

 $ yarn test

تشغيل اختبارات الوحدة مع تقرير التغطية

 $ yarn coverage

اختبارات E2E

يستخدم Cypress لاختبارات متصفح E2E. يتم تشغيل هذا تلقائيًا على CI لـ PRS ، ويمكن رؤية النتيجة على سحابة Cypress.

لتسجيل الاختبارات في Cypress Cloud ، يمكنك استخدام إحدى الطرق التالية بناءً على احتياجاتك:

• رسالة الالتزام : قم بتضمين [e2e record] في رسائل الالتزام الخاصة بك لتفعيل التسجيل.
• ملصقات GitHub : قم بتطبيق تسمية e2e record على طلب السحب الخاص بك لتشغيل التسجيل.

يساعد هذا الإعداد في إدارة أرصدة Cypress Cloud بشكل أكثر كفاءة ، مع التأكد من إجراء التسجيلات فقط عند الحاجة بشكل صريح.

لتشغيل الاختبارات محليًا ، حدد ما يلي في ملف cypress.env.json المحلي ، على سبيل المثال:

{
    " dhis2BaseUrl " : " https://test.e2e.dhis2.org/dev " ,
    " dhis2Username " : " admin " ,
    " dhis2Password " : " district " ,
}

قم بتشغيل الاختبارات بشكل تفاعلي (Cypress UI):

 yarn cypress:live

قم بإجراء اختبارات في وحدة التحكم دون واجهة المستخدم Cypress:

 yarn cypress:run

linting والتنسيق

إصلاح جميع انتهاكات على غرار الرمز القابلة للتثبيت تلقائيًا (أجمل و ESLINT)

 $ yarn format

تحقق من جميع الملفات للحصول على انتهاكات على غرار الكود (أجمل و ESLINT)

 $ yarn lint

بناء التطبيق والمكون الإضافي

 $ yarn build

الاختبار اليدوي مع NetLify

تم تكوين هذا الريبو لنشر طلبات السحب على NetLify. هذا يجعل من السهل مشاركة التنفيذ الجاري مع الآخرين (على سبيل المثال ، اختبار ، مدير المنتج ، UX ، زملائه المطورين) قبل الاندماج في الماجستير.

تتوفر طلبات السحب (أي #209) على:

https://pr-209--dhis2-data-visualizer.netlify.app

سيقوم NetLify أيضًا بإضافة فحص الحالة إلى كل PR الذي يرتبط مباشرة بنشر العلاقات العامة.