Problemen oplossen

Watcher ondersteunt alleen Chrome voor Testen, Chromium of Microsoft Edge

Hoewel de Axe Developer Hub-website meerdere browsers ondersteunt, ondersteunt het Watcher-pakket alleen Google Chrome voor Testen, Chromium of Microsoft Edge. Problemen die u kunt tegenkomen:

• Als u Google Chrome versie 139 of hoger gebruikt, ontvangt u een foutmelding van Watcher. Gebruik in plaats daarvan Chrome for Testing, Chromium of Microsoft Edge.
• Als u de Electron-browser van Cypress gebruikt, ontvangt u een foutmelding. Specificeer de browser als Chrome voor Testen, Chromium of Microsoft Edge wanneer u Cypress oproept; anders wordt standaard de Electron-browser gebruikt. Zie Browsers starten in de Cypress-documentatie voor meer informatie.

Als u WebdriverIO, WebDriverJS of Java Selenium gebruikt, moet u uw testopstelling zo configureren dat deze expliciet Chrome for Testing of Microsoft Edge gebruikt. Zie Gebruik Chrome voor Testen voor installatie-instructies en platformspecifieke configuratievoorbeelden.

Zie Geautomatiseerde Testplatforms voor meer informatie over ondersteunde software met Watcher.

Microsoft Edge werkt niet met Java Selenium

Als je Java Selenium-tests een IllegalStateException genereren met het bericht Ondersteuning voor Microsoft Edge vereist Selenium 4 of hoger, gebruikt je project Selenium 3. Selenium 3's EdgeOptions richt zich op de oude EdgeHTML-browser, die Axe Watcher niet ondersteunt. Upgrade selenium-java naar 4.x om in Microsoft Edge te testen of blijf in Chrome voor Testing of Chromium testen met ChromeOptions en ChromeDriver, die de Java Selenium integratie ondersteunt op Selenium 3.141.59 en later.

Geen resultaten van Microsoft Edge met WebdriverIO

Als je WebdriverIO-tests uitvoeren tegen Microsoft Edge, foutloos voltooien en geen resultaten produceren in Axe Developer Hub, controleer je Watcher-versie. Het gebruik van Microsoft Edge met WebdriverIO vereist Watcher 4.6.0 of later.

In eerdere versies stuurde Watcher zijn browseropties naar de goog:chromeOptions eigenschap. De Microsoft Edge WebDriver leest ze in plaats daarvan van ms:edgeOptions, dus werden de opties genegeerd en werd er geen analyse uitgevoerd. Er ging niets mis, daarom slaagden de tests met een lege resultaatset. Upgrade naar 4.6.0 of later om het probleem op te lossen.

De args eigenschap van een browsercapaciteit is ongeldig

Als Watcher meldt dat de args eigenschap van je goog:chromeOptions of ms:edgeOptions browsercapaciteit een array van strings moet zijn, stel args in op een array van browseropdrachtregelvlaggen, of verwijder het:

capabilities: {
  browserName: 'MicrosoftEdge',
  'ms:edgeOptions': {
    args: ['--window-size=1280,720']
  }
}

Waarden zoals een enkele string, een object of een array die iets anders bevat dan een string, worden afgewezen. Watcher 4.5.0 en eerder accepteerde sommige hiervan en faalde later met een niet-gerelateerde fout.

Toegankelijkheidsproblemen binnen een cross-origin iframe ontbreken

Als je analyse succesvol is maar je resultaten niets bevatten van een <iframe> die van een andere oorsprong dan de geteste pagina wordt bediend, is dat frame niet geanalyseerd. Watcher analyseert altijd frames van dezelfde oorsprong, maar het analyseert een cross-origin frame alleen als je de oorsprong van dat frame vermeldt:

• (JavaScript of TypeScript) allowedOrigins
• (Java) setAllowedOrigins()

axe: {
  allowedOrigins: [ 'https://pay.example.com' ]
}

Voeg de oorsprong van je eigen applicatie niet toe, die is altijd toegestaan.

Om te bevestigen welke oorsprongen zijn overgeslagen, zoek naar de cross_origin_frame_not_allowlisted diagnose. Het wordt gerapporteerd of je de optie nu wel of niet hebt ingesteld, het noemt de cross-origin oorsprongen die niet zijn geanalyseerd en het toont de configuratieregel die je kunt plakken. Diagnoses verschijnen alleen in debuguitvoer: stel DEBUG=axe-watcher:* in wanneer je je tests uitvoert (JavaScript of TypeScript), of configureer je logframework om DEBUG berichten voor Axe Watcher te tonen (Java). Met de Java Selenium integratie kun je ook debuglogboeken inschakelen met enableDebugLogger().

Als resultaten nog steeds ontbreken nadat je de oorsprong hebt vermeld:

• Het frame heeft een sandbox attribuut dat allow-same-origin weglaat, gerapporteerd als cross_origin_frame_unscannable. Het frame heeft dan een ondoorzichtige oorsprong die geen enkele vermelding in je lijst kan benoemen. Voeg allow-same-origin toe aan het sandbox attribuut.
• Het frame leidt door van de oorsprong in zijn src, zoals een apex-domein dat doorstuurt naar www, of http dat doorstuurt naar https. Vermeld de oorsprong waar het frame daadwerkelijk op eindigt.
• Het frame is meer dan één niveau diep genest. Dekkingsdiagnoses worden gemeld vanaf de bovenliggende pagina over de frames die het direct insluit, dus een diep genesteld frame blijft ongerapporteerd.

Als de analyse volledig mislukt in plaats van te weinig te rapporteren, zoek dan naar de cross_origin_frame_timed_out diagnose: een frame beantwoorde de eerste ping van Watcher maar leverde niet op tijd resultaten op. Verwijder die oorsprong uit je lijst of verhoog runOptions.frameWaitTime.

Als het frame wordt geanalyseerd maar de resultaten niet weerspiegelen wat je test erin deed, dan is automatische analyse de oorzaak. Het kan geen wijzigingen detecteren die in een frame zijn aangebracht, dus een toegestaan frame wordt geanalyseerd vanaf de laatste wijziging aan de bovenliggende pagina. Roep zelf analyze() aan na interactie met inhoud binnen een frame. Dit is een ander probleem dan Geen Pagina Staten Vastgelegd Na Overschakelen naar een Kindframe, wat van toepassing is wanneer de browsercontext in het frame wordt geschakeld.

Bekijk Analyseer Cross-Origin iframes voor het volledige beeld.

Oorsprongen geweigerd door allowedOrigins

Als Watcher meldt dat een allowedOrigins vermelding ongeldig is, is de vermelding niet een eenvoudige oorsprong die hij kan vergelijken met een frame. Elke vermelding heeft een schema (http of https), een host en een optionele poort nodig, zonder iets anders. Veelvoorkomende oorzaken:

• Een wildcard, zoals https://*.example.com. Benoem elke oorsprong expliciet.
• Een pad, querystring, fragment of inloggegevens, zoals https://pay.example.com/checkout.
• Een ontbrekend schema, zoals pay.example.com.
• Een schema anders dan http of https.
• Een domein dat tekens buiten het Engelse alfabet bevat, zoals café.example.com. Gebruik in plaats daarvan de punycodevorm.

Watcher wijst deze af in plaats van ze te negeren, omdat een vermelding die niet overeenkomt met de daadwerkelijke oorsprong van een frame, ervoor zou zorgen dat het frame niet geanalyseerd wordt terwijl je testuitvoeringen nog steeds succes rapporteren. Zie Analyseer Cross-Origin iframes.

Onvolledige Resultaten

Als uw testsuite meerdere testrunners gebruikt die parallel lopen en dezelfde niet-nul build-ID gebruiken, zullen de resultaten van elke testrunner de resultaten van andere testrunners voor dezelfde Git commit SHA vervangen, wat onvolledige resultaten oplevert. U moet ervoor zorgen dat elke testrunner dezelfde niet-nul build-ID gebruikt.

U stelt doorgaans het build ID in uw AxeConfiguration in.

Voor meer informatie over het gebruik van parallelle testuitvoerders met verschillende CI/CD-platforms, zie Tests Parallel uitvoeren.

Dubbele Toegankelijkheidsfouten of Verkeerde Telling van Nieuwe Problemen

Als uw website dynamische ID's of klassenamen gebruikt die veranderen telkens wanneer de pagina wordt vernieuwd, zult u waarschijnlijk dubbele toegankelijkheidsfouten zien, vooral problemen aangeduid als nieuw wanneer eerdere testruns hetzelfde probleem op hetzelfde element vertonen. (De Axe Developer Hub gebruikt ID's en klassen om hetzelfde element tussen testruns te identificeren.) Om dit probleem op te lossen, moet u de eigenschap ancestry in het object runOptions in uw configuratie instellen op true. Hieronder ziet u een voorbeeld van hoe u de optie in uw configuratie instelt:

axe: {
  runOptions: {
    ancestry: true
  }
}

Zie Gebruik van Dynamische Selectors voor meer richtlijnen over het gebruik van dynamische selectors.

Zie (JavaScript/TypeScript) runOptions of (Java) AxeWatcherOptions.setRunOptions() voor meer informatie.

Oude versie van @axe-core/watcher

Als je versie 3.18.0 of ouder van @axe-core/watcher gebruikt, zul je deze waarschuwingsmelding ontvangen:

Axe Developer Hub houdt zich nu aan de instellingen gedefinieerd in Axe-configuratie, en testruns die zijn gecreëerd door versies van @axe-core/watcher versie 3.18.0 of ouder genereren sessies die niet op de hoogte waren van de globale instellingen in Axe-configuratie. U moet uw @axe-core/watcher-pakket bijwerken en uw tests opnieuw uitvoeren om sessies te creëren die voldoen aan de Axe-configuratie van uw onderneming. Zie Gebruik van globale configuraties.

Geen Pagina Staten Vastgelegd Na Overschakelen naar een Kindframe

Als je test de huidige context van de browser naar een child-frame schakelt met switchToFrame() (WebdriverIO of WebDriverJS) of switchTo().frame() (Java Selenium), zal Axe Watcher geen paginastaten vastleggen voor acties die worden uitgevoerd terwijl de browser is gericht op het child-frame. Axe Watcher legt paginastaten alleen vast als de context van de browser zich op het bovenste niveau bevindt.

Dit is een ander probleem dan of een iframe inhoud wordt geanalyseerd. Watcher analyseert frames van dezelfde oorsprong en cross-origin frames waarvan je de oorsprong vermeldt; zie Analyseer Cross-Origin iframes.

Bijvoorbeeld: in WebdriverIO zal de click()-aanroep hieronder geen paginatoestand opleveren:

await browser.url('https://example.com')
const iframe = await browser.$('iframe')
await browser.switchToFrame(iframe)
// Actions taken in the child frame will not be analyzed
await button.click()

Om het vastleggen van paginastaten te hervatten, schakelt u terug naar het hoogste frame voordat u verder gaat:

// WebdriverIO
await browser.switchToParentFrame()

// WebDriverJS / Java Selenium
await driver.switchTo().defaultContent()

Extra paginatoestand gegenereerd door cy.screenshot()

Als u cy.screenshot() aanroept in uw Cypress-tests, kan Axe Watcher een extra paginatoestand genereren. Wanneer Cypress een screenshot maakt, wijzigt het kort de DOM om animaties uit te schakelen, en de DOM-waarnemer van Axe Watcher kan die wijziging detecteren als een paginatoestandverandering. Dit is verwacht gedrag en heeft geen invloed op de nauwkeurigheid van uw toegankelijkheidsresultaten.

Controller methode time-out

(Alleen JavaScript of TypeScript) U ontvangt een bericht dat lijkt op het volgende als oproepen naar de Controller-methoden (gedefinieerd in de Controller abstracte basisklasse als analyze(), flush(), start(), en stop()) of Cypress-aangepaste commando's tijdoverschrijden:

Error: Watcher could not send results to the server. To resolve this problem, adjust your `timeout.flush` property within your configuration or see https://docs.deque.com/developer-hub/wa-troubleshooting for more troubleshooting.

De opgegeven Controller-methode (hier de flush()-methode) had meer tijd nodig dan de standaardtijd om te voltooien en is verlopen. U kunt de standaardtijd wijzigen door een timeout-object aan uw configuratie toe te voegen:

axe: {
  timeout: {
    flush: 10000
  }
}

Zie Time-outs instellen voor informatie over het gebruik van time-outs.

Zie Timeouts Interface en timeouts voor meer informatie. De standaardwaarden voor time-outs zijn weergegeven in de tabel onder de Timeouts Interface.

Resultaten verschijnen niet

Als u uw testsuite hebt uitgevoerd en er worden geen resultaten weergegeven in Axe Developer Hub voor een bepaald project, kan de oorzaak te vinden zijn in de redenen in de volgende secties:

Axe Watcher niet configureren

Uw gewijzigde testsuite moet de juiste configuratiefunctie voor uw testframework aanroepen voordat u uw tests uitvoert. Als u Axe Watcher niet correct configureert, ontvangt u een bericht dat u Axe Watcher moet configureren. Bijvoorbeeld, als u vergeet Axe Watcher met Cypress te configureren, zult u dit bericht zien wanneer u uw testsuite uitvoert:

Cypress is not configured for axe Watcher. Please ensure that axe Watcher's cypressConfig() is invoked within Cypress's defineConfig() in your cypress.config.js. All tests will fail with this error.

Raadpleeg de configuratie instructies voor configuratievoorbeelden voor uw taal en browsertestframework.

Resultaten niet doorspoelen

U moet de flush()-functie (of de aangepaste opdracht axeWatcherFlush() in Cypress) aanroepen om de verzamelde resultaten terug te sturen naar Deque's servers zodat de resultaten getoond kunnen worden op de Axe Developer Hub-website. Meestal roept u de flush()-functie aan in de opruimhaak van uw automatiseringsplatform.

Bijvoorbeeld: in het support/e2e.js-bestand in Cypress voegt u de oproep aan afterEach() toe:

// Flush axe-watcher results after each test.
afterEach(() => {
  cy.axeWatcherFlush()
})

De --incognito Optie Gebruiken

U kunt de --incognito-opdrachtregeloptie niet gebruiken met Chrome; anders zullen uw tests stilletjes falen. Als u de incognitomodus gebruikt om te vermijden dat gecachte bestanden op schijf worden geschreven (gecachede bestanden worden alleen in het geheugen bewaard in incognitomodus), gebruik dan de cachingmethoden van uw testsuite in plaats daarvan.

De Vereiste Omgevingsvariabelen Niet Instellen

Als u experimenteert met de voorbeelden in de watcher-examples repo op GitHub, let er dan op dat de voorbeelden omgevingsvariabelen gebruiken voor het instellen van de API-sleutel en project-ID, API_KEY en PROJECT_ID.

Testen Worden Te Snel Uitgevoerd

Je tests kunnen te snel worden uitgevoerd, waardoor de pagina wordt vrijgemaakt en de middelen worden vrijgegeven voordat Watcher het kan analyseren. Om dit probleem op te lossen, kun je aan het einde van de test een vertraging toevoegen om tijd te geven om de pagina te analyseren.

Bijvoorbeeld, in Cypress kunt u een vertraging van 10 seconden (10.000 milliseconden) toevoegen met de cy.wait()-methode:

describe('Visitor', () => {
  it('should visit example.com', () => {
    cy.visit('https://www.example.com')
    cy.wait(10000);  })
})

Ontbrekende of Ongeldige API-sleutel

Een ongeldige of ontbrekende API-sleutel verschijnt als een ongeldige configuratiebestand in Cypress. De stack-trace zal onthullen of het ongeldig of ontbrekend is. Een ontbrekende-sleutel resulteert in het volgende:

AssertionError [ERR_ASSERTION]: API key is required
    at validateApiKey ...

(Vele regels van de stacktrace zijn verwijderd omwille van de beknoptheid.)

Een ongeldige-sleutel resulteert in de volgende stack-trace (verkort):

Error: Server responded to https://axe.deque.com/api/api-keys/test/validate/axe-devtools-watcher with status code 404:
{"error":"Invalid API key"}
    at Response.getBody
...

Hulp

Als u uw probleem niet kunt oplossen, neem dan mail ons dan met ons op zodat we kunnen helpen.