Yahoo! User Interface Blog (YUIBlog)

YUI: Open uur don 24 mei

YUIDoc Updates en Travis CI Integratie

Met de nieuwste versie van YUIDoc en zijn recente post op het krijgen van YUI testen uitgevoerd op Travis CI , het lijkt een goed moment om een praatje en Q & A met Dav hebben. Niet dat er een slechte tijd om een ​​praatje met Dav hebben.

Tijd & Details

We zullen online op donderdag van 10u tot 11u PDT.

We gaan terug naar het gebruik van Adobe Connect deze week, omdat de uitzending resolutie van Google + Spots on Air was een beetje laag, en we willen graag de chat te zijn toegankelijk voor niet-IRC gebruikers. Laat het ons weten als u het eens of oneens zijn in de commentaren.

Opname

De opname is beschikbaar in de YUILibrary YouTube kanaal .

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

YUI en Travis zitten in een git-boom

De afgelopen weken heb ik besteed veel tijd om YUI kern testen uitgevoerd op Travis CI . Vanaf vandaag, elke druk op onze YUI 3 repo op GitHub resulteert in meer dan 6.000 (6.053 om precies te zijn) unit tests worden uitgevoerd en geregistreerd. Deze testen omvatten 1.130 van onze core JavaScript-only unit tests uitvoeren native binnenkant van Node.js op versies 0.4.x en 0.6.x (met 0.7.x ondersteuning binnenkort worden toegevoegd). We volgen dat met onze volledige unit test suite (4923 tests), hardlopen met mijn command-line YUITest / PhantomJS wrapper, Grover .

Vandaag wil ik u vertellen iets meer over hoe en waarom we dit doen.

Waarom?

Voor de langste tijd, onze tests en bouwt waren een mysterie voor onze gebruikers. Ze hebben allemaal gebeurd achter gesloten deuren en niemand echt wist wat we deden. In de afgelopen paar jaar zijn we gestart met het toevoegen van meer en meer van onze tests om onze bron boom, zodat mensen kunnen zien wat we actief aan het testen. Dit hielp een beetje, maar het heeft niet laten zien dat we elke test op elke build lopen en dat als een test mislukt, we niet duwen die opbouwen tot GitHub.

Toen kwam Travis CI, de open source continuous integration platform dat direct haken in GitHub. Ik speelde rond met het voor een dag en meteen begon te bewegen onze tests rond, zodat we konden gebruiken. We willen meer transparantie in onze processen en het publiek om te zien wat we testen en hoe we het doen mogelijk te maken.

Een ding willen we toevoegen aan dit proces is de toegang tot onze huidige code coverage rapport. Op dit moment hebben we een code coverage, dagelijks van tests uitgevoerd in FF12, Chrome-laatste en IE8, maar geen van onze gebruikers kunnen zien dat we op ~ 80% aan bod:

We zijn erg hard gewerkt om dit probleem recht te zetten en hopelijk krijgen deze gegevens in de open voor iedereen om te zien.

Hoe?

Ik moest een minimale wijzigingen aan te brengen aan onze kern-test suites, om hen te kunnen werken onder Node.js in Travis CI. Met de "core-test suites", ik bedoel een YUI module die kan uitvoeren zonder de noodzaak van een werkende DOM. Dit omvat, maar is niet beperkt tot: YUI Core, Lader, YQL, Y.Array, Y.Object, enz. Deze modules zijn allemaal perfect bruikbaar binnenkant van Node.js zonder wijzigingen.

Laten we eens kijken naar de YQL testen als voorbeeld.

Het enige wat ik moest doen was een Node.js wrapper vergelijkbaar met de standaard-test wrapper die we gebruiken in een browser en bevatten exact dezelfde test die is uitgevoerd in de browser.

Hier is de YQL module wrapper:

Nu kan deze dezelfde test module worden uitgevoerd in een browser en in Node.js ongewijzigd!

Voorbehoud?

Om voor deze tests native draaien in Node.js, moeten ze geen interactie met de DOM. Bijvoorbeeld, Y.Array bestaat uit helper methoden voor het omgaan met Array s in JavaScript. Maar er zijn een paar tests die onder meer te maken met DOM-elementen om ervoor te zorgen dat de helper methoden de juiste waarden terug te keren. Voor deze tests, moest ik de DOM-gerelateerde code te verplaatsen naar een nieuwe test en die test toe te voegen aan de lijst van genegeerd testen wanneer Y.UA.nodejs wordt gedetecteerd. Op deze manier worden dergelijke tests genegeerd in Node.js, maar nog steeds uitgevoerd in de browser.

Hier is een voorbeeld:

Zoals je kunt zien, is het relatief eenvoudig om onze tests uit te voeren in beide omgevingen om ervoor te zorgen dat onze code is stabiel en volledig functioneel bij gebruik in Node.js zoals het is in de browser.

Wat is Grover?

Grover is een command-line tool die u toelaat om uit te voeren YUITest op basis van tests in PhantomJS. PhantomJS is een headless Webkit bijvoorbeeld die u toelaat om een ​​HTML-pagina weergeven zonder een GUI aanwezig. Dus Grover sluit het gat op deze en kunt u onze unit tests die via de command-line binnenkant van een CI systeem zoals Travis.

Grover is gratis en beschikbaar via: npm install -g grover (. U moet het PhantomJS binaire geïnstalleerd voor het gebruik van Grover hebben)

Hoe zien wij dit alles?

Travis CI biedt een volledig verslag van de vorige builds, maar ook een up-to-date informatie over de status. Hieronder staan ​​de links naar onze huidige projecten gehost op Travis CI:

• YUI 3
• YUIDoc
• Yeti
• Grover

Hier is een klein stukje van wat onze build-uitgang eruit ziet (van de te bouwen historie voor de yui3 repo ):

Wat doet het?

We proberen de nieuwe Travis / GitHub Pull Vraag functie op al onze projecten. Dit betekent dat wanneer een ontwikkelaar een pull-aanvraag indient bij ons, Travis automatisch hun code te trekken, samen te voegen het in master (op de server) en draaien onze volledige unit test suite tegen. Hun "Travis Bot" zal automatisch terug plaats een commentaar op de Pull Vraag het vertellen van de ontwikkelaar of hun patch zijn tests doorstaan.

Hier is een voorbeeld van een pull-aanvraag passeren:

En een waarbij het mislukt:

Wat biedt de toekomst

We zijn van plan over het toevoegen van ondersteuning voor de uitvoering van onze tests met Yeti, zodra het wordt stabiel genoeg om te draaien op elke te bouwen. We kijken ook naar de implementatie van onze code coverage nummers ook. Anders dan dat, voel je vrij om ons te vertellen op welke andere manieren kunnen we meer open dan we nu zijn.

Ik, voor een, ben heel blij met al deze nieuwe features en ik hoop jullie ook!

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

YUI 3.6.0 PR1 is nu beschikbaar

We zijn blij om de beschikbaarheid van YUI 3.6.0 PR1 voor de gemeenschap testen en feedback te kondigen. Neem even de tijd om het te controleren via CDN of downloaden .

Hier zijn de streefdata voor alle YUI 3.6.0 mijlpalen:

• PR1 - 08 mei 2012
• PR2 - 12 juni 2012
• PR3 - 17 juli 2012
• GA - 31 juli 2012

Een overzicht van artikelen die wij zijn op het werken voor YUI 3.6.0 zijn onder andere:

• ScrollView verbeteringen
• DataTable functies en prestatieverbeteringen
• Grafieken bug fixes
• Image preview functie in Uploader
• Pop-up Kalender
• YUI zaad en wereldwijde herwerkt voor prestaties

We zijn ook het nemen van maatregelen om onze ontwikkelingscyclus condenseren zodat we de overgang naar maandelijkse releases in de nabije toekomst.

De lijst van onderwerpen die in 3.6.0 PR1 en de volledige lijst van dit onderwerp voor 3.6.0 zijn beschikbaar in onze bug tracker.

Wij nodigen u uit om te sluiten bij de verdere ontwikkeling gesprekken gebeurt met het team over op GitHub.

We kijken uit naar uw verdere feedback!

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

YUIDoc 0.3.0 is officieel!

Vandaag zijn we blij met de officiële release van de nieuwe aan te kondigen YUIDoc , onze JavaScript documentatie generator. YUIDoc is een Node.js applicatie die API-documentatie genereert uit de opmerkingen in de bron, met behulp van een syntaxis vergelijkbaar met tools zoals Javadoc en Doxygen. YUIDoc is momenteel het voeden van de API-documentatie voor YUI en is actief bijgewerkt in het afgelopen jaar .

[Bekijk Grotere afbeelding]

YUIDoc luidt als volgt:

• Live previews. YUIDoc omvat een stand-alone doc-server, waardoor het triviaal om uw documenten bekijken zoals je schrijft.
• Gegenereerde documentatie moderne opmaak. YUIDoc's is een aantrekkelijke, functionele webapplicatie met echte URL's en sierlijk fallbacks voor spinnen en andere middelen die niet kan worden uitgevoerd JavaScript.
• Brede taalondersteuning. YUIDoc werd oorspronkelijk ontworpen voor de YUI project, maar het is niet gebonden aan een bepaald bibliotheek of programmeertaal. U kunt het gebruiken met elke taal die ondersteuning biedt voor /* */ commentaar blokken.

Sommige van de nieuwe functies toegevoegd aan deze versie zijn:

• Markdown ondersteuning in code commentaar
• Ondersteuning voor veel meer labels uit de doos
• Logic gescheiden te zorgen voor een gemakkelijke uitbreidbaarheid
• Betere ondersteuning thematisering
• Server-modus voor ontwikkeltijd previews
• Externe data mengen
• Eenvoudige cross-platform-installatie
• Cross-linking binnen en van buiten van het huidige project
• JSON gebaseerde configuratie

Laten we in een wat meer detail op een aantal van deze:

Eenvoudige installatie

Als u Node.js en NPM geïnstalleerd, de installatie is eenvoudig:

  NPM-g install yuidocjs 

Markdown ondersteuning in code commentaar

YUIDoc zal ontleden je reactie met Markdown voordat het past het stuur template waardoor u een grote flexibiliteit bij het ​​schrijven van uw documenten.

Logic gescheiden te zorgen voor een gemakkelijke uitbreidbaarheid

YUIDoc maakt gebruik van YUI de klasse van de infrastructuur binnen en exporteert alle van deze modules wanneer u require de yuidocjs module. Hierdoor kunnen eindgebruikers aan te sluiten in YUIDoc de binnenkant en de manier waarop het doet dingen te veranderen. U kunt verlengen klassen, vergroten ze of gewoon flat out verandering methoden om de suite uw behoeften.

Betere ondersteuning thematisering

In deze release hebben we gebruik maken van de ingebouwde Y.Handlebars helper om alle template generatie af te handelen. We hebben ook ontwikkeling in aanmerking bij het bouwen van deze functie. YUIDoc zal eerst zoeken deze auto is gebouwd in de thema map voor partials, dan zal het zoeken in uw lokale thema directory. Hiermee kunt u alleen de bestanden die u wilt veranderen in uw thema en niet elke gedeeltelijke kopie, zelfs als u niet wijzigen in stand te houden.

Server-modus voor ontwikkeltijd previews

Dit is mijn favoriete nieuwe feature! U kan blazen YUIDoc in server-modus en het geeft je live previews van uw documentatie als u deze bewerkt. Gewoon het bestand opslaan en opnieuw laden van de pagina uit de ingebouwde server en zie uw wijzigingen te leven. Inclusief externe data en cross-linking. U hoeft niet langer tot de documenten te genereren voor uw gehele project om er maar een documentatie verandering te zien!

Externe data mengen

YUIDoc kunt u nu uw documentatie te koppelen aan de geleverde output van een andere YUIDoc bijvoorbeeld. Bijvoorbeeld, als uw project is het gebruik van YUI en uitbreiding van een aantal van onze belangrijkste lessen, kunt u een link naar onze geëxporteerde data.json bestand (van onze YUIDoc build) en wanneer YUIDoc uw documentatie ontleedt het zal halen onze gegevens en cross-link al uw uitgebreide klassen terug naar de onze. Deze manier hoef je niet naar een andere projecten code te documenteren, hoeft u alleen wijzen naar hun docs als was het een deel van jou.

Project Wijzigingen

Alle toekomstige YUIDoc ontwikkeling zal volledig worden uitgevoerd op Github. We zullen het volgen van het project op de wiki en het gebruik van hun problemen om onze tickets te beheren. Het zal worden uitgevoerd als een native Node.js project volledig in de open lucht. We zullen ook een Google-discussiegroep gebruiken voor uw vragen, dus schrijf u vandaag nog !

We zijn ook blij te kunnen melden dat YUIDoc de unit tests worden gehost op Travis-CI en loopt per Github druk!

• Bron
• Documentatie
• API Docs
• Google-discussiegroep
• Travis-CI

Hoe zit het met de oude versie van YUIDoc?

De oude Python bron voor YUIDoc is in een vestiging op de huidige Github repo waar het zal voor onbepaalde tijd blijven. Er zijn geen plannen op het aanvaarden van een pull vraagt ​​of het maken van alle bijwerkingen van die code base.

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

YUI: Open uur don 10 mei

YUI 3.5.0 Uploader

Uploader was een andere component die een belangrijke upgrade zag in 3.5.0. Van de vele veranderingen, een grote een was de toevoeging van ondersteuning voor native functies in browsers die HTML5.

Doe mee voor een discussie met de auteur, Allen Rabinovich , waarin we praten over hoe de uploader is gestructureerd, enkele van de uitdagingen met moderne technieken die moesten worden aangepakt, en wat er op de routekaart voor de komende versies.

Tijd & Details

We zullen online op donderdag van 10u tot 11u PDT.

Deze week zullen we het uitproberen van Google Plus Spots on Air, waardoor de audio-en video-feed zal worden door G +, en we zullen controleren chat in de # yui IRC kanaal op freenode .

Bekijk de opname

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

Aankondiging YUI 3.5.1

We zijn blij om de beschikbaarheid van YUI 3.5.1 aan te kondigen op CDN of als downloaden . YUI 3.5.1 is een kleinere scoped release van bugfixes alleen.

Veel plezier!

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!

Weergeven Controls in een gegevenstabel: een overzicht

Onlangs was er een vraag in het forum over het gebruik van invoer-velden van een DataTable. Met de voortdurende druk om steeds meer complexe toepassingen in de browser te bouwen, heb ik besloten dat een overzicht van de beschikbare opties voor het bewerken van gegevens in tabelvorm nuttig kan zijn.

De meest eenvoudige manier om gegevens te bewerken zou zijn om inline editing te gebruiken, maar dit is nog niet beschikbaar in YUI 3 DataTable. In de tussentijd, een optie is om uw eigen invoervelden rollen direct in de tabel cellen, vergelijkbaar met dit voorbeeld .

Als u niet wilt elke verandering als het gebeurt op te slaan, kunt u gebruik maken van de QuickEdit plaats gallery module. Hiermee kunt u bewerken alle zichtbare cellen vervolgens en sla de wijzigingen in een enkele handeling.

De bovenstaande oplossingen zijn modaal. Als u liever een niet-modale manier om alle cellen te bewerken, kunt u gebruik maken van de Bulk-editor widget. Dit werkt met paginering, dus u kunt alle wijzigingen in alle pagina's van uw tafel in een enkele bewerking. Het laat je zelfs eenvoudig toevoegen en verwijderen van rijen - en zelfs als u gebruik maakt van een externe DataSource!

Bulk-editor is niet gebouwd op de top van YUI DataTable, echter. Als u andere functies van YUI DataTable, kunt u gebruik maken van de staat behoud plugin voor YUI 3 DataTable. Dit werkt ook met paginering, zodat u alle waarden op te slaan op alle pagina's in een keer, maar het is niet ontworpen om u te laten gemakkelijk toe te voegen of te verwijderen rijen.

De staat behoud plugin is ook handig als je iets wilt eenvoudiger te doen zoals het weergeven van selectievakjes voor het selecteren van rijen in een tabel.

De reden voor al deze verschillende oplossingen is dat de engineering trade-offs zijn vrij ingewikkeld, dus het is niet aan te raden om een enkele aanrecht oplossing voor al deze functies te ondersteunen bouwen. Hopelijk zal dit overzicht kunt u de juiste module te kiezen voor de aanpak van uw volgende grote tafel-gebaseerde applicatie.

Over de auteur: John Lindal ( @ jafl5272 op Twitter) is een van de leidende ingenieurs de bouw van de basis waarop Yahoo! APT is gebouwd. Daarvoor werkte hij op de Yahoo! Publisher Network.

Zoek gesprekken: Bloglines | technorati

Delen en uit te breiden: Bookmark met del.icio.us | Digg it! | reddit!