उत्तरदायी डिजाइन के लिए TDD। या गैलेन फ्रेमवर्क का उपयोग करके विभिन्न उपकरणों के लिए साइट डिस्प्ले परीक्षण को स्वचालित कैसे करें

गैलेन फ्रेमवर्क क्या है, यह एक शीर्षक के साथ तैयार करना मुश्किल है। यह सब इस तथ्य से शुरू हुआ कि मुझे विभिन्न ब्राउज़रों में साइटों का परीक्षण करने और जांचने की आवश्यकता थी: क्या मार्कअप गया था, उदाहरण के लिए, एक ही इंटरनेट एक्सप्लोर या क्रोम में। इसके बाद रिस्पॉन्सिव वेब-डिज़ाइन मॉड आया, और मुझे मैन्युअल रूप से ब्राउज़र की चौड़ाई बदलनी पड़ी और यह देखना पड़ा कि साइटें कैसे प्रदर्शित होती हैं। और, हालांकि इस समय सभी हाथ में वेबड्राइवर और सेलेनियम ग्रिड थे, जावा कोड में साइट लेआउट को सामान्य रूप से जांचना संभव नहीं था। विचारों में से एक था: सेलेनियम ग्रिड में विभिन्न ब्राउज़रों में स्क्रीनशॉट लें और फिर उन सभी को एक बड़ी रिपोर्ट में एकत्र करें, जिसके अनुसार एक परीक्षक को अपनी आंखों पर जाना चाहिए और विसंगतियों के मामले में, एक दोष की रिपोर्ट करें। दुर्भाग्य से, यह पूरा उपक्रम लंबे समय तक नहीं चला। एक बहुत बड़ी रिपोर्ट के माध्यम से पत्ते छोड़ने और स्क्रीनशॉट की तुलना करने के लिए परीक्षक बहुत आलसी थे, और वे अभी भी मामूली दोष से चूक गए थे। और फिर सभी उत्तरदायी डिजाइन साइटों के लिए कार्यान्वयन की आवश्यकताएं आईं। और यहाँ गैलेन फ्रेमवर्क दिखाई दिया। समाधान सरल निकला: एक दूसरे के सापेक्ष तत्वों के आकार और स्थिति की जांच करें। ऐसा करने के लिए, हमें एक विशेष गैलेन स्पेक्स भाषा की आवश्यकता थी, जिसे पढ़ना और समझना आसान होगा।



संक्षेप में, गैलेन फ्रेमवर्क एक विशेष भाषा और एक ब्राउज़र में साइट के प्रदर्शन के परीक्षण के लिए उपकरण है। यह आपको उत्तरदायी डिज़ाइन का परीक्षण करने की अनुमति देता है, साथ ही साइट के क्रॉस-ब्राउज़र परीक्षण का भी संचालन करता है।


गैलन फ्रेमवर्क (या बस गैलेन) वांछित ब्राउज़र में पेज खोलने के लिए सेलेनियम का उपयोग करता है, ब्राउज़र विंडो का आकार बदलता है और वेब पेज पर तत्वों (पूर्ण स्थिति और आकार) के बारे में जानकारी प्राप्त करता है।

एक अन्य विचार के रूप में, गैलेन टीडीडी (टेस्ट ड्रिवेन डेवलपमेंट) दृष्टिकोण के साथ एक फ्रंट एंड विकसित करने का सुझाव देता है। यह सरल है: पहले गैलेन सिंटैक्स का उपयोग करके एक परीक्षण लिखें, फिर फ्रंटएंड को लागू करें, परीक्षण चलाएं और रीफैक्टरिंग करें। आपको इस पद्धति का पालन करने की आवश्यकता नहीं है जब तक कि यह सिर्फ एक अवधारणा है। दुर्भाग्य से, गैलेन फ्रेमवर्क को अभी तक युद्ध में पूरी तरह से परीक्षण नहीं किया गया है, और अब इसे हमारी कंपनी में पेश करने का प्रयास किया जा रहा है। हालांकि, मुझे लगता है कि गैलेन परीक्षणों का उपयोग करके TDD दृष्टिकोण के साथ एक दृश्यपटल विकसित करने के बहुत विचार पर एक नज़र रखना दिलचस्प होगा। तो चलिए शुरू करते हैं। कल्पना करें कि हम विचार कर रहे हैं कि विभिन्न उपकरणों के लिए साइट का अनुकूलन कैसे किया जाए।

चरण 1. चलो एक नियमित नोटबुक में एक साइट खाली करें

आइए तीन अलग-अलग उपकरणों के लिए एक साधारण स्केच बनाने की कोशिश करें:



जैसा कि आंकड़े से देखा जा सकता है, हमने 3 प्रकार के उपकरणों की पहचान की: मोबाइल, टैबलेट, डेस्कटॉप। और, हमारी रूपरेखा को देखते हुए, साइट के कुछ तत्वों को विभिन्न उपकरणों पर अलग-अलग तरीके से प्रदर्शित किया जाएगा।

चरण 2. गैलन चश्मा लेखन

सादगी के लिए, हम सभी एक फ़ाइल में करेंगे: होमपेज.स्पेक
उस पृष्ठ पर सभी तत्वों के नामों को परिभाषित करें जिसके साथ हम काम करेंगे। मैं गैलेन सिंटैक्स को बाद में समझाऊंगा, और अब मैं सबसे सरल परीक्षण डिजाइनों का उपयोग करने की कोशिश करूंगा। निम्नलिखित पोस्ट में, यदि नेटवर्क के उपयोगकर्ताओं को यह टूल दिलचस्प लगता है, तो मैं परीक्षण के लिए और अधिक जटिल दृष्टिकोण प्रस्तुत करने का प्रयास करूंगा। आप आधिकारिक वेबसाइट galenframework.com पर सभी वाक्यविन्यास और उदाहरण भी देख सकते हैं

चूँकि मुझे HTML में मेरा मार्कअप कैसे बनाया जाएगा, इस बारे में अनुमानित विचार है, मैं परीक्षण तत्वों के लिए "लोकेटर" निर्दिष्ट कर सकता हूं। सामान्य तौर पर, गैलेन में, आप तीन प्रकार के लोकेटर का उपयोग कर सकते हैं: आईडी, सीएसएस, xpath। मैं आपको सलाह देता हूं कि xpath से बचें, इसका उपयोग केवल दुर्लभ मामलों में करें जब आईडी और सीएसएस आपको पृष्ठ से वांछित आइटम का चयन करने की अनुमति न दें।

=========================================== header id header header-logo css #header .logo header-caption css #header h1 menu id menu menu-item-* css #menu li a content id content side-panel id side-panel side-panel-caption css #side-panel h2 side-panel-links-* css #side-panel li a article id article article-caption css #article h1 article-text id article-text comments id comments footer id footer ========================================== 

जैसा कि आप देख सकते हैं, कुछ वस्तुओं के नाम में * है। यह आवश्यक है जब पृष्ठ पर कई समान तत्व हों। इस मामले में, गैलेन पहले दिए गए लोकेटर के अनुसार सभी तत्वों को खोजेगा, और फिर निर्दिष्ट नाम के साथ ऑब्जेक्ट बनाएगा, केवल * के बजाय यह 1. से शुरू होने वाले सीरियल नंबर को प्रतिस्थापित करेगा। उदाहरण के लिए, मेनू-आइटम- *। यदि हमारी वेबसाइट पर 4 मेनू आइटम हैं, तो गैलन क्रमशः ऑब्जेक्ट बनाएंगे: मेनू-आइटम -1, मेनू-आइटम -2, मेनू-आइटम -3, मेनू-आइटम -4।

मैं आपको सलाह देता हूं कि आप अभी तक मेनू आइटम के लिए परीक्षण न लिखें। एक साधारण से शुरू करना बेहतर है: हमारी साइट के ढांचे का परीक्षण करना। आइए गैलेन को यह समझाने की कोशिश करें कि ब्राउज़र के आकार के आधार पर इसे हमारी वस्तुओं का परीक्षण कैसे करना चाहिए। हम चार टैग का उपयोग करेंगे: मोबाइल, टैबलेट, डेस्कटॉप, सभी। हम अपनी खुद की सुविधा के लिए उत्तरार्द्ध का परिचय देंगे, ताकि हमें साधारण परीक्षणों के लिए सभी उपकरणों को सूचीबद्ध न करना पड़े।

हम वस्तुओं को घोषित करने के बाद कोड का अगला टुकड़ा हमारे होमपेज.स्पेक फ़ाइल में जोड़ देंगे, हालांकि, वास्तव में, इससे कोई फर्क नहीं पड़ता कि हम स्वयं चेक कहां लिखते हैं।

 @ all ------------------------------------ header width: 100% of screen/width height: 100px above: menu 0px menu width: 100% of screen/width below: header 0px above: content 0px footer width: 100% of screen/width height: > 100px content inside: screen 0px left below: menu 0px @ desktop, tablet ----------------------------------- side-panel width: 300px below: menu 0px inside: screen 0px right near: content 0px right menu height: 50px footer below: content 0px @ mobile ----------------------------------- side-panel width: 100% of screen/width below: content 5px content width: 100% of screen/width above: side-panel 5px footer below: side-panel 0px 

जैसा कि आप देख सकते हैं, डेस्कटॉप और टैबलेट टैग के लिए, सामग्री ऑब्जेक्ट केवल एक है जिसकी चौड़ाई परिभाषित नहीं है। ऐसा इसलिए है क्योंकि गैलेन में अभी तक अंकगणितीय ऑपरेशन (उदाहरण के लिए, 100% स्क्रीन / चौड़ाई - 300px) का उपयोग करने की क्षमता नहीं है। लेकिन, दूसरी तरफ, यह बहुत ही शानदार होगा। हमारे परीक्षण में, एक पक्ष-पैनल जांच है कि यह बाईं ओर सामग्री ऑब्जेक्ट के बगल में स्थित है। यह भी संकेत मिलता है कि सामग्री स्क्रीन के बाईं ओर, और दाईं ओर साइड-पैनल से जुड़ी हुई है। इस प्रकार, यदि सामग्री की चौड़ाई बहुत छोटी या बहुत बड़ी है, तो यह "पास: सामग्री 0px सही" की जाँच करते समय उल्लंघन में दिखाई देगा, और किसी भी मामले में हम इस दोष को याद नहीं करेंगे।

ऊपर दिए गए कोड को अनुकूलित किया जा सकता है, लेकिन मैं अधिक स्पष्टता के लिए ऐसा नहीं करता हूं। अब तक, यह हमारे फ्रेम के लेआउट को शुरू करने के लिए पर्याप्त है। इसे अनुकूलित करने का तरीका यहां दिया गया है:

चरण 3. एचटीएमएल / सीएसएस लिखना

अब हमारा मुख्य पृष्ठ लिखते हैं। फिर मैंने सबसे सरल पृष्ठ को स्केच किया, जिस पर हमारे चेक नमूनों का परीक्षण करना संभव होगा। colenframework.com/tutorial1/tutorial1.html

चरण 4. गैलेन में परीक्षण चलाएं

हमारा मुख्य पृष्ठ तैयार है। हम विभिन्न उपकरणों के लिए गैलेन में परीक्षण चला सकते हैं। डिफ़ॉल्ट रूप से, फ़ायरफ़ॉक्स ब्राउज़र का उपयोग किया जाएगा।

चेतावनी! क्योंकि गैलन सेलेनियम का उपयोग करता है, यह अत्यधिक संभावना है कि नवीनतम फ़ायरफ़ॉक्स ब्राउज़र का समर्थन नहीं किया जाएगा। यह सेलेनियम की दुनिया में मुख्य सिरदर्द में से एक है, और मुझे अभी तक यह पता नहीं चला है कि गैलेन के लिए इसे कैसे हल किया जाए। मैं केवल गैलेन में सेलेनियम के संस्करण को नवीनतम अपडेट कर सकता हूं और आशा करता हूं कि फ़ायरफ़ॉक्स की अगली रिलीज़ के साथ, मोज़िला के लोग एपीआई में गंभीर बदलाव करना बंद कर देंगे और सेलेनियम की निर्भरता को तोड़ देंगे। वैकल्पिक रूप से, आप विशेष रूप से गैलेन के लिए अपना स्वयं का वेब-आधारित ब्राउज़र विकसित कर सकते हैं, लेकिन यह मेरे लिए समय की बर्बादी जैसा लगता है।

डेस्कटॉप, टैबलेट और मोबाइल संस्करण में एक अलग जांच के लिए कमांड लाइन से तीन कमांड चलाएं।

 galen check homepage.spec --url "http://samples.galenframework.com/tutorial1/tutorial1.html" --size 1024x768 --include "all,desktop" --htmlreport desktop-reports galen check homepage.spec --url "http://samples.galenframework.com/tutorial1/tutorial1.html" --size 600x800 --include "all,tablet" --htmlreport tablet-reports galen check homepage.spec --url "http://samples.galenframework.com/tutorial1/tutorial1.html" --size 400x600 --include "all,mobile" --htmlreport mobile-reports 

नतीजतन, गैलेन एक HTML रिपोर्ट बनाएगा जिसमें आप सभी संपूर्ण जांच पा सकते हैं, साथ ही त्रुटि संदेश भी देख सकते हैं।



यदि हम लाल रंग में हाइलाइट किए गए चेक पर क्लिक करते हैं, तो हमें हाइलाइट किए गए ब्लॉकों के साथ एक स्क्रीनशॉट मिलता है जो इस चेक का उल्लंघन करता है।



जैसा कि आप देख सकते हैं, संदेश कहता है "साइड-पैनल" 5px के बजाय "सामग्री" से नीचे 0px है। यानी साइट के हमारे संस्करण में मोबाइल संस्करण के लिए "सामग्री" और "साइड-पैनल" वस्तुओं के बीच 5 पिक्सल का कोई निर्दिष्ट इंडेंट नहीं है। हमें इसके बारे में कुछ करना होगा। यदि यह एक बग है, तो हम अपने लेआउट की मरम्मत करेंगे और इस इंडेंटेशन को जोड़ेंगे। यदि हम ध्यान नहीं रखते हैं कि इंडेंट किस आकार का है, तो हम संकेत दे सकते हैं कि यह इस तरह से कारण के भीतर होना चाहिए: नीचे: सामग्री 0 से 10 पीएक्स। यानी इंडेंटेशन 0 से 10 तक की सीमा में हो सकता है।

अपने लेआउट को सही करने या चेक को सही करने के बाद, आप फिर से परीक्षण चला सकते हैं। केवल लॉन्च विधि किसी तरह बहुत सुविधाजनक नहीं है। आपको अलग-अलग कमांड को अलग-अलग चलाना होगा और विभिन्न फ़ोल्डरों में रिपोर्ट पढ़ना होगा। चलो गैलेन की एक और विशेषता का लाभ उठाते हैं - तथाकथित गैलेन टेस्ट सूट। एक गैलन-ट्यूटोरियलटैस्ट फ़ाइल बनाएँ, इसमें निम्नलिखित लिखें:

 @@ Parameterized | device | size | tags | | desktop | 1024x768 | all,desktop | | tablet | 600x800 | all,tablet | | mobile | 400x600 | all,mobile | Tutorial 1 Home page in ${device} device http://samples.galenframework.com/tutorial1/tutorial1.html ${size} check homepage.spec --include "${tags}" 

हो गया। अब हम अपने परीक्षण चला सकते हैं और सभी रिपोर्टों को एक में जोड़ सकते हैं।

 galen test galen-tutorial.test --htmlreport reports 

आप इस लिंक पर परिणाम की रिपोर्ट देख सकते हैं: नमूने.galenframework.com/tutorial1/reports/report.html

अधिक जटिल और विस्तृत जांच

हमारा ढांचा तैयार है और परीक्षण किया गया है, हम और अधिक जटिल जांच के लिए आगे बढ़ सकते हैं। मैं प्रदर्शन के लिए गैलन भाषा की अधिक विशेषताओं का उपयोग करने का प्रयास करूंगा। कल्पना कीजिए कि हमने एक वेबसाइट लोगो और शीर्षक पाठ जोड़ा है

 @ all ----------------------------------- header-logo inside: header 10px left centered vertically inside: header height: 60px header-caption inside: header 10 to 20px top left near: header-logo ~ 10 px text is: My Awesome Website! 

जैसा कि आप देख सकते हैं, नए चेक दिखाई दिए हैं: "अंदर की ओर लंबवत" और "पाठ" है। पहला वाला चेक करता है कि हमारा लोगो बीच में और हेडर ऑब्जेक्ट के अंदर लंबवत है, और दूसरा सिर्फ टेक्स्ट चेक करता है।
आपने संभवतः एक नया प्रतीक "~" भी देखा है, जिसका अर्थ है कि हम त्रुटि के 2 पिक्सल के भीतर एक अनुमानित तुलना करना चाहते हैं (गैलेन में आप लगभग तुलना के लिए त्रुटि को कॉन्फ़िगर कर सकते हैं)।

अब एक और भी जटिल परीक्षण। आइए देखें कि डेस्कटॉप और टैबलेट पर मेनू को क्षैतिज रूप से रखा गया है, और मोबाइल संस्करण पर तालिका में दो कॉलम हैं, जैसा कि हमने वास्तव में लेख की शुरुआत में हमारे स्केच में योजना बनाई है। मैं कोड टिप्पणियों में प्रत्येक चेक के वाक्यविन्यास को समझाने की कोशिश करूंगा। यदि आपको याद है, तो शीर्ष पर हमने मेनू ऑब्जेक्ट्स को "मेनू-आइटम- * css #menu li a" के रूप में परिभाषित किया है। यानी गैलेन को सभी मेनू आइटम मिलेंगे; हमारे पास उनमें से केवल 4 हैं, फिर हमें ऑब्जेक्ट्स मेनू-आइटम -1, मेनू-आइटम -2, मेनू-आइटम -3, मेनू-आइटम -4 मिलते हैं।

 @ all -------------------------------------- # ,              menu contains: menu-item-* #       50  menu-item-* height: 50px @ desktop, tablet -------------------------------------- # ,            (0px) [ 1 - 3 ] menu-item-@ near: menu-item-@{+1} 0px left aligned horizontally: menu-item-@{+1} @ mobile -------------------------------------- #            menu-item-* width: 45 to 50 % of menu/width # ,     ( ) #      -  #   ,           [ 1, 3 ] menu-item-@ near: menu-item-@{+1} 0px left aligned horizontally: menu-item-@{+1} # ,     ( ) #      -  [1, 2] menu-item-@ above: menu-item-@{+2} 0px aligned vertically: menu-item-@{+2} 

निर्माण [1 - 9] गैलेन को निर्देश देता है कि अगली वस्तु को अपने सभी चेक के साथ परिचालित किया जाए और जहां भी @ चिह्न हो, पैरामीटर के वर्तमान मूल्य को प्रतिस्थापित करें। आप एक सीमा निर्दिष्ट कर सकते हैं, या आप अल्पविराम [1, 3, 6, 10] द्वारा अलग किए गए विशिष्ट मान निर्दिष्ट कर सकते हैं। इसके अलावा, जैसा कि ऊपर दिए गए उदाहरण में देखा गया है, हमने @ {+ 1} निर्माण का उपयोग किया। ये सबसे सरल अंकगणितीय ऑपरेशन हैं जो हमें सूची में अगली वस्तु को इंगित करने की अनुमति देते हैं।

और इसलिए यह एड इनफिनिटम पर जा सकता है। जैसा कि आप देख सकते हैं, आप पृष्ठ पर तत्वों की लगभग किसी भी व्यवस्था की जांच कर सकते हैं। मुख्य बात यह है कि चेक का सही तरीका चुनना है, ताकि बाद में आप परीक्षण समर्थन के साथ समस्याएं पैदा न करें।
यदि आप यह पता लगाने में रुचि रखते हैं कि गैलन फ्रेमवर्क में कौन सी अन्य सुविधाएँ उपलब्ध हैं, तो आप आधिकारिक galenframework.com वेबसाइट पर जा सकते हैं। बाद में मैं कुछ और लेख पोस्ट करने की कोशिश करूंगा (उदाहरण के लिए, सेलेनियम ग्रिड का उपयोग करके विभिन्न ब्राउज़रों में परीक्षण को स्वचालित करने के लिए या घटक परीक्षण का सही उपयोग कैसे करें)।

मैं गैलेन के फायदे और नुकसान (कमियों) को संक्षेप में सूचीबद्ध करूंगा।

गैलन क्या कर सकते हैं:

• एक दूसरे के सापेक्ष ब्लॉक के स्थान की जाँच करें
• दृश्य पाठ जांचें
• सेलेनियम ग्रिड के साथ काम करें
• परीक्षण पृष्ठ पर कस्टम जावास्क्रिप्ट चलाएँ (यदि, उदाहरण के लिए, आपको ड्रॉप-डाउन मेनू खोलने और उसके तत्वों की जाँच करने की आवश्यकता है)
• साइट पर सही जगह पाने के लिए, सेलेनियम के माध्यम से ब्राउज़र के साथ बातचीत करें, अगर आप इसे सीधे लिंक के माध्यम से नहीं बुला सकते हैं
• घटक परीक्षण गैलन निर्दिष्ट ऑब्जेक्ट्स के लिए अलग स्कैन फाइलें चला सकता है। इस प्रकार, पृष्ठ पर जटिल तत्वों को दोहराने के चेक को लागू करना संभव है (उदाहरण के लिए, खोज परिणाम, टिप्पणियां, आदि)
• वस्तुओं के आकार और स्थिति में समायोजन करें। यह दो मामलों में उपयोगी हो सकता है: या तो सेलेनियम ऑब्जेक्ट के स्थान के बारे में गलत जानकारी देता है, या हमें तथाकथित "गाइड" (या वर्चुअल एंकर ऑब्जेक्ट) की आवश्यकता होती है, जिससे हम पृष्ठ पर अन्य वस्तुओं से संबंधित होंगे
• स्थितियों के ब्लॉक। यह तब उपयोगी हो सकता है जब यह पता लगाना असंभव हो कि किस तत्व को पृष्ठ पर प्रदर्शित किया जाएगा (जैसे बैनर)
• परीक्षण सूट में परीक्षणों का परिमाणीकरण। वैसे, आप आगे जा सकते हैं और पैरामीटर के मानकीकरण का उपयोग कर सकते हैं (एक दुर्लभ मामला, लेकिन आप उदाहरण के लिए, विभिन्न आकारों के लिए और यहां तक ​​कि विभिन्न ब्राउज़रों के लिए एक ही परीक्षण चला सकते हैं)

गैलेन अभी तक क्या नहीं कर सकता:

• दृश्य पाठ के स्थान की जाँच करें, न कि पूरे ब्लॉक (उदाहरण के लिए, h1 टैग)। स्क्रीनशॉट में पाठ की परिभाषा को लागू करने की योजना है, लेकिन यह केवल फ़ायरफ़ॉक्स में काम करेगा (सेलेनियम क्रोम और IE में स्क्रीनशॉट के साथ समस्या है)
• असली मोबाइल ब्राउज़र में चलाएं। यह एक सेलेनियम समस्या है क्योंकि यह एंड्रॉइड ब्राउज़र में एक पृष्ठ पर तत्वों के स्थान के बारे में जानकारी प्राप्त करने की अनुमति नहीं देता है। समाधान आपके स्वयं के जावास्क्रिप्ट-आधारित उपकरण (उदाहरण के लिए, बस्टरजेएस के रूप में या सेलेनियम 1.0 के रूप में) विकसित करने के लिए हो सकता है। इस मामले में, आप सामान्य रूप से किसी भी ब्राउज़र के साथ काम कर सकते हैं। या आप iOS और Android के लिए अपना स्वयं का ब्राउज़र लिख सकते हैं जो गैलेन के साथ संचार का समर्थन करता है। लेकिन एक व्यक्ति के लिए यह बहुत मुश्किल होगा, इसलिए अब मैं इस विचार को स्थगित कर दूंगा
• स्क्रीनशॉट में रंग की जाँच करें और छवि के कुछ हिस्सों की तुलना करें। हिस्टोग्राम्स के लिए रंग सरगम ​​की एक सरल तुलना विकसित करने की योजना है (उदाहरण के लिए, color scheme is: 80 to 85 % black, ~10% white या color scheme like: image-samples/menu.png )। गैलन एक स्क्रीनशॉट लेगा, निर्दिष्ट तत्व के क्षेत्र का चयन करेगा और इसकी रंग योजना की तुलना करेगा। आप सबसे सरल छवि तुलना भी जोड़ सकते हैं, हालांकि, यह मुझे लगता है कि यह बेमानी है।
• पैरामीटर किए गए चेक में जटिल अंकगणितीय ऑपरेशन करें। अब तक, आप केवल ऐसा कर सकते हैं: @ {+ 1}, @ {* 2}, @ {- 1}, @ {/ 10}। लेकिन कोष्ठक का उपयोग करके पूर्ण अंकगणितीय अभिव्यक्ति बनाने की योजना है
• नियमित जांच में अंकगणितीय ऑपरेशन करें। उदाहरण के लिए, width: 100% of screen/width - 10px - 100% of comments/width + 10% of somethingelse/width तरह कुछ करना अच्छा होगा width: 100% of screen/width - 10px - 100% of comments/width + 10% of somethingelse/width
• कोई सेन इंस्टॉलर नहीं है। मशीन पर जावा 1.6+ होना चाहिए, दुर्भाग्यवश मुझे इंस्टॉलर बनाने का कोई अनुभव नहीं है, लेकिन मुझे जल्द ही कुछ करने की उम्मीद है

परियोजना GitHub github.com/ishubin/galen पर पोस्ट की गई है और इसे Apache लाइसेंस, संस्करण 2.0 के तहत लाइसेंस प्राप्त है।

गैलन केवल एक व्यक्ति द्वारा समर्थित है और अभी तक कहीं भी वितरित नहीं किया गया है। हम इसे अपनी कंपनी में लागू करने की कोशिश कर रहे हैं, लेकिन अभी तक किसी भी सफलताओं के बारे में बात करना जल्दबाजी होगी। यदि आप परियोजना में रुचि रखते हैं, तो मुझे किसी भी प्रतिक्रिया को प्राप्त करने में खुशी होगी, विशेष रूप से रचनात्मक आलोचना। परियोजना बीटा में है और इसका परीक्षण किए जाने की आवश्यकता है। दोष यहां github.com/ishubin/galen/issues पर भेजे जा सकते हैं। आप इस लिंक galenframework.com/download पर प्रोजेक्ट डाउनलोड कर सकते हैं