請用此 Handle URI 來引用此文件：
http://tdr.lib.ntu.edu.tw/jspui/handle/123456789/5499完整後設資料紀錄
| DC 欄位 | 值 | 語言 |
|---|---|---|
| dc.contributor.advisor | 陳彥仰(Mike Y. Chen) | |
| dc.contributor.author | Hsiang-Sheng Liang | en |
| dc.contributor.author | 梁翔勝 | zh_TW |
| dc.date.accessioned | 2021-05-15T18:00:47Z | - |
| dc.date.available | 2015-02-03 | |
| dc.date.available | 2021-05-15T18:00:47Z | - |
| dc.date.copyright | 2015-02-03 | |
| dc.date.issued | 2014 | |
| dc.date.submitted | 2014-10-03 | |
| dc.identifier.citation | [1] R. Al-Ekram, A. Adma, and O. Baysal. diffx: An algorithm to detect changes in multi-version xml documents. In Proceedings of the 2005 Conference of the Centre for Advanced Studies on Collaborative Research, CASCON ’05, pages 1–11. IBM Press, 2005.
[2] G. J. Badros, A. Borning, K. Marriott, and P. Stuckey. Constraint cascading style sheets for the web. In Proceedings of the 12th annual ACM symposium on User interface software and technology, UIST ’99, pages 73–82, New York, NY, USA, 1999. ACM. [3] I. Banerjee, B. Nguyen, V. Garousi, and A. Memon. Graphical user interface (gui) testing: Systematic mapping and repository. Information and Software Technology, 55(10):1679 – 1694, 2013. [4] A. Bezerianos, P. Dragicevic, and R. Balakrishnan. Mnemonic rendering: an image- based approach for exposing hidden changes in dynamic displays. UIST ’06, pages 159–168, 2006. [5] Brackets - open-source code editor. http://brackets.io/. [6] Cactus.https://github.com/winston/cactus. [7] T.-H. Chang, T. Yeh, and R. C. Miller. Gui testing using computer vision. In Pro- ceedings of the SIGCHI Conference on Human Factors in Computing Systems, CHI ’10, pages 1535–1544, 2010. [8] W.-K. Chen, H.-T. Wu, J.-C. Wang, and Z.-W. Shen. An automatic gui testing ap- proach using hierarchical finite state machine. In The Fourth Taiwan Conference on Software Enfineering (TCSE08), 2008. [9] CSS Critic: A lightweight framework for regression testing of CSS. http:// cburgmer.github.io/csscritic/. [10] cssert.http://thingsinjars.github.io/cssert/. [11] CSSunit.https://github.com/gagarine/CSSunit. [12] Chrome Developer Tools. https://developers.google.com/ chrome-developer-tools/. [13] K. Dobolyi and W. Weimer. Modeling consumer-perceived web application fault severities for testing. Technical report, 2010. [14] S. Doğan, A. Betin-Can, and V. Garousi. Web application testing: A systematic literature review. Journal of Systems and Software, 91(0):174 – 201, 2014. [15] P. Dragicevic, S. Huot, and F. Chevalier. Gliimpse: Animating from markup code to rendered documents and vice versa. UIST ’11, pages 257–262, 2011. [16] O. El Ariss, D. Xu, S. Dandey, B. Vender, P. McClean, and B. Slator. A systematic capture and replay strategy for testing complex gui based java applications. In In- formation Technology: New Generations (ITNG), 2010 Seventh International Con- ference on, pages 1038–1043, April 2010. [17] R. B. Evans and A. Savoia. Differential testing: a new approach to change detection. ESEC-FSE companion ’07, pages 549–552, 2007. [18] Firebug.http://getfirebug.com/. [19] P. Geneves, N. Layaida, and V. Quint. On the analysis of cascading style sheets. WWW ’12, pages 809–818, 2012. [20] Hardy.http://hardy.io. [21] Huxley.https://github.com/facebook/huxley. [22] M. Keller and M. Nussbaumer. Cascading style sheets: a novel approach towards productive styling with today’s standards. WWW ’09, pages 1161–1162, 2009. [23] T. D. LaToza and B. A. Myers. Designing useful tools for developers. PLATEAU ’11, pages 45–50, 2011. [24] H.-S. Liang, K.-H. Kuo, P.-W. Lee, Y.-C. Chan, Y.-C. Lin, and M. Y. Chen. Seess: Seeing what i broke – visualizing change impact of cascading style sheets (css). In Proceedings of the 26th Annual ACM Symposium on User Interface Software and Technology, UIST ’13, pages 353–356, New York, NY, USA, 2013. ACM. [25] H. W. Lie. Cascading style sheets. [26] LiveReload.http://livereload.com/. [27] A. M. Memon. Automatically repairing event sequence-based gui test suites for regression testing. ACM Trans. Softw. Eng. Methodol., 18(2):4:1–4:36, Nov. 2008. [28] A. Mesbah and M. R. Prasad. Automated cross-browser compatibility testing. In Proceedings of the 33rd International Conference on Software Engineering, ICSE ’11, pages 561–570, New York, NY, USA, 2011. ACM. [29] A. Mesbah, A. van Deursen, and S. Lenselink. Crawling Ajax-based web applica- tions through dynamic analysis of user interface state changes. TWEB ’12, pages 3:1–3:30, 2012. [30] Mogotest | Web Consistency Testing Made Easier. http://mogotest.com/. [31] J. Nielsen. Iterative user-interface design. Computer, 26(11):32–41, Nov. 1993. [32] Node.js.http://nodejs.org/. [33] PhantomCSS: CSS regression testing. https://github.com/Huddle/ PhantomCSS. [34] PhantomJS.http://phantomjs.org/. [35] V. Quint and I. Vatton. Editing with style. In Proceedings of the 2007 ACM sympo- sium on Document engineering, DocEng ’07, pages 151–160, New York, NY, USA, 2007. ACM. [36] D. Reed and J. Davies. The convergence of computer programming and graphic design. J. Comput. Sci. Coll., 21(3):179–187, Feb. 2006. [37] D.Roest.AutomatedRegressionTestingofAjaxWebApplications.Master’sthesis, Delft University of Technology, 2010. [38] D. Roest, A. Mesbah, and A. v. Deursen. Regression testing ajax applications: Cop- ing with dynamism. In Proceedings of the 2010 Third International Conference on Software Testing, Verification and Validation, ICST ’10, pages 127–136, Washing- ton, DC, USA, 2010. IEEE Computer Society. [39] S. Roy Choudhary, H. Versee, and A. Orso. Webdiff: Automated identification of cross-browser issues in web applications. In Proceedings of the 2010 IEEE Inter- national Conference on Software Maintenance, ICSM ’10, pages 1–10, Washington, DC, USA, 2010. IEEE Computer Society. [40] Sahi.http://sahi.co.in/. [41] Selenium.http://docs.seleniumhq.org/. [42] E. Soechting, K. Dobolyi, and W. Weimer. Syntactic regression testing for tree- structured output. In In International Symposium on Web Systems Evolution, 2009. [43] G. Valiente. An efficient bottom-up distance between trees. In Proceedings of the 8th International Symposium of String Processing and Information Retrieval, pages 212–219. Press, 2001. [44] W3C Recommendation of Cascading Style Sheets, Level 1, 1996. http://www. w3.org/TR/CSS1/. [45] T. Yeh, T.-H. Chang, and R. C. Miller. Sikuli: using gui screenshots for search and automation. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, UIST ’09, pages 183–192, 2009. | |
| dc.identifier.uri | http://tdr.lib.ntu.edu.tw/jspui/handle/123456789/5499 | - |
| dc.description.abstract | 層疊樣式表（CSS）是表述網頁外觀呈現的基礎網頁語言。開發者將一份 CSS 樣式規則套用在數個頁面，減少原始碼的重複，並且讓網頁有一致的外觀與感覺。然而，當 CSS 規則被修改時，開發者也得要手動地、事必躬親地去檢測每一個被變更到的網頁區塊。我們推出 SeeSS，一個可以在網站裡自動追蹤 CSS 變更、並替開發者將所有變更視覺化的系統。變更前後的不同，會以動畫來加以強調。SeeSS 的開發歷經兩個迭代，初期成果也已經以開源的方式，釋出給網頁開發者們。 | zh_TW |
| dc.description.abstract | Cascading Style Sheet (CSS) is a fundamental web language for describing the presentation of web pages. CSS rules are often reused across multiple parts of a page and across multiple pages throughout a site to reduce repetition and to provide a consistent look and feel. When a CSS rule is modified, developers currently have to manually track and visually inspect all possible parts of the site that may be impacted by that change. We present SeeSS, a system that automatically tracks CSS change impact across a site and enables developers to easily visualize all of them. The differences before and after the change are highlighted using animations. We refine its implementation during a 2-iteration design process, and release SeeSS as an open source tool for all web developers. | en |
| dc.description.provenance | Made available in DSpace on 2021-05-15T18:00:47Z (GMT). No. of bitstreams: 1 ntu-103-R01922036-1.pdf: 2689391 bytes, checksum: 4fe7d7e64ef88af8c1ae0a61988ea006 (MD5) Previous issue date: 2014 | en |
| dc.description.tableofcontents | 1 Introduction ...................................... 1
2 Related Work ...................................... 5 2.1 Web Browser Developer Tools ..................... 5 2.2 Web UI Testing Automation Tools ................. 5 2.3 CSS Unit Testing Tools........................... 6 2.4 Regression Testing for Web....................... 7 3 First Iteration Design and Implementation ......... 9 3.1 SeeSS GUI ....................................... 9 3.2 Site Crawler .................................... 10 3.3 Impact Tracker .................................. 10 3.4 Impact Visualizer ............................... 10 3.5 Implementation .................................. 11 4 First Iteration Developer Feedback ................ 12 4.1 StudyDesign ..................................... 12 4.2 Participants .................................... 13 4.3 Results ......................................... 13 5 First Iteration Discussion ........................ 15 5.1 Waiting for Thumbnails .......................... 15 5.2 Using File Search ............................... 15 5.3 Designing Thumbnails ............................ 16 5.4 Summary of First Iteration ...................... 17 6 Second Iteration Brainstorming .................... 18 6.1 Empirical Design Choices in Previous Iteration .. 18 6.2 Brainstorming Procedure ......................... 18 6.3 Resulted Ideas and Concepts ..................... 20 6.4 Voting Results................................... 22 6.5 Concurrency of Concepts.......................... 24 6.6 Summary ......................................... 25 7 Second Iteration Design and Implementation ........ 26 7.1 Augment, Rather Than Replace Experiences ........ 27 7.2 Impact Visualizer ............................... 27 7.3 Site Recorder ................................... 28 7.4 Renderer Graph................................... 29 7.5 File Tracker..................................... 31 7.6 SeeSS Report .................................... 32 7.7 Implementation .................................. 32 7.8 Early Results ................................... 32 8 Limitation and Future Work ........................ 35 8.1 Changes not Recorded ............................ 35 8.2 Changes to the UI Flow........................... 35 8.3 Internally Maintained States .................... 36 8.4 Thumbnail Animations ............................ 37 8.5 Impact Rankingand Clustering..................... 37 9 Conclusion ........................................ 38 Bibliography ........................................ 39 | |
| dc.language.iso | en | |
| dc.title | SeeSS：為 CSS 開發者設計之即時變更衝擊視覺呈現 | zh_TW |
| dc.title | SeeSS : Instant Change Impact Visualization for CSS~Developers | en |
| dc.type | Thesis | |
| dc.date.schoolyear | 103-1 | |
| dc.description.degree | 碩士 | |
| dc.contributor.oralexamcommittee | 陳昇瑋(Sheng-Wei Chen),余能豪(Neng-Hao Yu),陳偉凱(Woei-Kae Chen) | |
| dc.subject.keyword | 開發工具,工具包,網頁開發,層疊樣式表,變更視覺化, | zh_TW |
| dc.subject.keyword | Development Tools,Toolkits,Web Development,Cascading Style Sheet,Change Visualization, | en |
| dc.relation.page | 43 | |
| dc.rights.note | 同意授權(全球公開) | |
| dc.date.accepted | 2014-10-03 | |
| dc.contributor.author-college | 電機資訊學院 | zh_TW |
| dc.contributor.author-dept | 資訊工程學研究所 | zh_TW |
| 顯示於系所單位： | 資訊工程學系 | |
文件中的檔案：
| 檔案 | 大小 | 格式 | |
|---|---|---|---|
| ntu-103-1.pdf | 2.63 MB | Adobe PDF | 檢視/開啟 |
系統中的文件，除了特別指名其著作權條款之外，均受到著作權保護，並且保留所有的權利。