Om een zachte regeleinde te onderscheiden van een opgeslagen nieuwe regel, schakel je woordterugloop uit in een teksteditor en bekijk je de oorspronkelijke tekst. Deze Mac-gids legt uit hoe je dat controleert, hoe browserindelingen je op het verkeerde been kunnen zetten en wat gekopieerde code daadwerkelijk kan bewijzen.

Wat is het verschil tussen een zachte regeleinde en een nieuwe regel?

Een zachte regeleinde ontstaat wanneer een browser of editor tekst naar een volgende weergaveregel verplaatst om binnen de beschikbare breedte te passen. Een opgeslagen nieuwe regel maakt deel uit van de tekst zelf. Het W3C maakt onderscheid tussen zachte regeleinden en geforceerde regeleinden, die kunnen voortkomen uit behouden nieuwe-regeltekens of blokgrenzen. CSS-verwerking van witruimte verandert de weergave zonder de onderliggende documentgegevens te wijzigen. CSS Text Module Level 3

Dat onderscheid leidt tot drie mogelijkheden wanneer code op meerdere regels verschijnt: één logische regel is omgeslagen; de tekst bevat afzonderlijke logische regels; of de structuur van de pagina dwingt een visuele regeleinde af. Op basis van alleen een schermafbeelding kun je niet betrouwbaar vaststellen welke mogelijkheid van toepassing is.

Hier betekent „ingevoerde nieuwe regel” een nieuwe regel die aanwezig is in de bron die je onderzoekt. De aanwezigheid ervan zegt niet wie die heeft toegevoegd: een formatter, exportproces of andere transformatie kan ervoor hebben gezorgd. De praktische taak is vast te stellen of een grens bij de tekst hoort of alleen bij de huidige weergave.

Hoe controleer je code in een Mac-desktopeditor?

Gebruik Visual Studio Code voor deze werkwijze. Begin indien mogelijk met het oorspronkelijke codebestand. Als je alleen een openbare pagina hebt, kopieer je de relevante code naar een apart editordocument, maar beschouw dat document als bewijs van de gekopieerde tekst totdat je het met een origineel kunt vergelijken.

Schakel woordterugloop uit zonder de tekst opnieuw op te maken

  1. Open het bestand of de gekopieerde voorbeeldtekst in VS Code.
  2. Druk met de editor actief op Option+Z om Toggle Word Wrap uit te voeren.
  3. Kijk of de schijnbare voortzetting weer aansluit op de voorgaande weergaveregel en horizontaal doorloopt.
  4. Als woordterugloop al uitgeschakeld was, schakel je deze nogmaals om beide toestanden te vergelijken. Het belangrijkste is het verschil tussen de twee weergaven.

Microsoft vermeldt Option+Z als de standaardmacOS-sneltoets voor Toggle Word Wrap, met opdracht-ID editor.action.toggleWordWrap. Als je sneltoetsen afwijken, zoek je die opdracht op in de editor Keyboard Shortcuts. Referentie voor standaardsneltoetsen

Wanneer editor.wordWrap is ingesteld op on, loopt VS Code tekst terug op basis van de breedte van het editorvenster. Als je woordterugloop uitschakelt, verdwijnen die visuele voortzettingen. Een grens die in dezelfde, ongewijzigde tekst blijft staan, is een logische regeleinde en geen zachte regeleinde van die editor. Basisbewerking

Gebruik deze beslissingstabel bij het vergelijken van de weergaven:

Waarneming Wat dit ondersteunt Volgende stap
Een voortzetting sluit weer aan op de voorgaande regel wanneer woordterugloop uitstaat Het was een zachte regeleinde in de editor Laat de tekst ongewijzigd
Twee regels blijven gescheiden wanneer woordterugloop uitstaat De onderzochte tekst bevat een regeleinde Vergelijk met het origineel als je een kopie hebt onderzocht
Een paginagrens verdwijnt in de gekopieerde tekst De pagina en de gekopieerde weergave verschillen Onderzoek de tekst en structuur van de pagina
Een gekopieerde grens blijft staan, maar er is geen origineel beschikbaar De gekopieerde tekst bevat die grens Laat de herkomst ervan onbepaald

Probeer een synthetisch voorbeeld

Plak het volgende voorbeeld van één regel in een apart document. Het is illustratieve JavaScript-tekst; uitvoeren is niet nodig.

const labels = ["Amber", "Birch", "Cedar", "Dune", "Elm", "Fern", "Grove", "Harbor"];

Maak het editorvenster smal genoeg om de tekst te laten omlopen. Met woordterugloop ingeschakeld kan de instructie meerdere weergaveregels beslaan. Schakel woordterugloop uit: de instructie hoort terug te keren naar één logische regel, ook als je horizontaal moet scrollen om het einde te lezen.

Vergelijk dit nu met de bewust meerregelige versie:

const labels = [
  "Amber", "Birch", "Cedar", "Dune",
  "Elm", "Fern", "Grove", "Harbor"
];

Deze vier logische regels blijven gescheiden wanneer woordterugloop uitstaat. Bij een smalle breedte kan elk ervan ook omlopen. Dat is het nuttige onderscheid: opgeslagen nieuwe regels en zachte regeleinden kunnen naast elkaar voorkomen in hetzelfde codefragment.

Maak het document tijdens de vergelijking niet opnieuw op. Het doel is de weergave te wijzigen terwijl de onderzochte tekst gelijk blijft. Anders kan een gewijzigde regeleinde het gevolg zijn van een bewerking in plaats van een weergave-instelling.

Waarom is het formaat van een browservenster wijzigen slechts een eerste test?

Stel je een abstracte openbare pagina voor met een navigatiekolom en een codepaneel. Als je de browser breder maakt, krijgt het paneel mogelijk meer ruimte. Als een grens naar een ander woord verschuift, ondersteunt dat de verklaring dat de tekst omloopt. Als het paneel echter een vaste breedte heeft, kan het formaat van het buitenste venster ongewijzigd blijven.

Een grens die op dezelfde plek blijft, geeft dus geen uitsluitsel. De browser kan een nieuwe regel behouden, een structurele regeleinde tegenkomen of tekst laten omlopen binnen een paneel waarvan de bruikbare breedte niet is veranderd. Bevestig het resultaat aan de hand van de tekstweergave en beschouw het wijzigen van de venstergrootte niet als bewijs.

CSS bepaalt ook of opgeslagen nieuwe regels zichtbaar zijn. MDN documenteert de volgende veelgebruikte waarden: CSS-eigenschap white-space

CSS-waarde Verwerking van nieuwe regels in de bron Automatisch omlopen
normal Samengevoegd met andere witruimte Toegestaan
pre Behouden Uitgeschakeld
pre-wrap Behouden Toegestaan
pre-line Behouden; spaties en tabs samengevoegd Toegestaan

Daardoor kan pre-wrap beide soorten grenzen tegelijk weergeven, terwijl normal nieuwe regels in de bron kan verbergen. Woordterugloop uitschakelen met nowrap is geen geschikte test om te bepalen of de bron behouden blijft, omdat witruimte daarbij ook wordt samengevoegd. Voor een eenvoudig tekstblok dat je beheert, is pre de relevante vergelijking wanneer je behouden witruimte zonder automatisch omlopen nodig hebt. CSS-eigenschap white-space

Kun je aan gekopieerde tekst de oorspronkelijke nieuwe regels zien?

Gekopieerde tekst is nuttig, maar vormt een afzonderlijke weergave. MDN beschrijft innerText als weergegeven tekst die benadert wat je zou krijgen door een element te selecteren en te kopiëren. De eigenschap reageert op de weergegeven vorm, inclusief expliciete regeleinden zoals br-elementen. Een nieuwe regel in een geplakt voorbeeld bewijst dus op zichzelf niet dat de oorspronkelijke codestring er een bevatte. HTMLElement: de eigenschap innerText

Voor een eenvoudige statische codecontainer beantwoordt textContent een andere vraag: deze eigenschap retourneert de tekst van het knooppunt en zijn afstammelingen, waarbij tekst van afstammelingen wordt samengevoegd zonder rekening te houden met de weergegeven vorm. Dat maakt de eigenschap bruikbaar om DOM-tekst te onderzoeken, mits de container daadwerkelijk de code bevat die je nodig hebt. Node: de eigenschap textContent

Deze eigenschappen zijn geen onderling uitwisselbare hulpmiddelen om tekst te reconstrueren. Een structurele regeleinde hoeft geen nieuwe regel in textContent te zijn; omgekeerd kan witruimte in de bron bestaan zonder als zichtbare regeleinde te verschijnen. Beschrijf het resultaat precies wanneer de tekst en indeling van de pagina niet overeenkomen: „de DOM-tekst bevat een nieuwe regel”, „de indeling dwingt een regeleinde af” of „de gekopieerde versie bevat een nieuwe regel”. Doe geen uitspraken die verder gaan dan wat de onderzochte weergave aantoont.

Wat verandert er bij een code-editor in de browser?

Een browsereditor kan zijn document afzonderlijk van de weergegeven elementen bijhouden. De officiële brondocumentatie van CodeMirror beschrijft bijvoorbeeld documentregels via het Text-model: lines telt logische regels en line(n) haalt een regel op aan de hand van het nummer. De positie to van een regel bevindt zich vóór de daaropvolgende regeleinde of aan het einde van het document. Documentatie van de CodeMirror-API voor documenttekst

CodeMirror documenteert ook dat de weergave alleen de zichtbare code plus een omliggende marge naar de DOM tekent. De eigenschap lineWrapping beschrijft het omlopen in de weergave. Daarom is het tellen van weergegeven regels of het uitlezen van de zichtbare editor-DOM onvoldoende om de regels van het volledige document vast te stellen. Documentatie van de CodeMirror-API voor de editorweergave

Gebruik voor een gewone desktopcontrole de gedocumenteerde download-, export- of kopieeropdracht van de toepassing wanneer die beschikbaar is en bekijk vervolgens dat resultaat met woordterugloop uitgeschakeld. Als je een CodeMirror-integratie beheert, gebruik je het documentmodel om de logische regels vast te stellen. Een bibliotheek-API bewijst niet dat elke toepassing een vergelijkbare bediening voor gebruikers biedt.

Kan een formulier nieuwe regels toevoegen die nooit zijn getypt?

Ja. De WHATWG HTML-standaard maakt onderscheid tussen de huidige API-waarde van een textarea en de weergave ervan bij verzending. Met wrap="soft" kan tekst visueel omlopen zonder extra regeleinden bij verzending. Met wrap="hard" kunnen in de weergave bij verzending regeleinden worden toegevoegd; daarvoor moet cols zijn opgegeven. De API-waarde normaliseert regeleinden naar LF. HTML-standaard: het textarea-element

Dit is van belang wanneer je tekst vóór en na een formulierworkflow vergelijkt. Een grens die alleen in een verzonden of geëxporteerd resultaat voorkomt, kan in die verwerkingsfase zijn ontstaan. Onderzoek de weergave die relevant is voor je taak: de huidige editortekst wanneer je getypte grenzen identificeert, of het resulterende bestand wanneer je wilt bepalen wat er daadwerkelijk is geëxporteerd.

Hoe behoud je grenzen van browserindeling en tekstvormgeving?

Laat het visuele omlopen over aan de browser of editor. Het W3C schrijft voor dat overflow-wrap: anywhere clusters van grafemen bij elkaar houdt en de vormgeving behoudt over de toegevoegde regeleinde. Regels opnieuw opbouwen door na een vast aantal tekens nieuwe regels in te voegen, bootst die indelingsregels niet na. CSS Text Module Level 3

Als je een codefragment wilt hergebruiken, haal je eerst de best beschikbare bron op, vergelijk je de tekst met woordterugloop aan en uit en behoud je de opgeslagen regeleinden, tenzij je iets wilt wijzigen. Als alleen een weergegeven pagina beschikbaar is, noteer je wat je over die weergave kunt vaststellen en laat je onzekere grenzen onbeslist. Zo kun je de controle herhalen zonder dat een aanpassing van de weergave per ongeluk de tekst verandert.

Bronnen