Bakerversity
Module 4: Respecting the Reader's Time & EyesLesson 3 of 8

Lab 4.1: Structured Data Parsing & Filter Configuration

Act as a localization engineer performing triage on corrupted structured data assets across JSON, YAML, and Android XML.

Objective

In this hands-on lab, you will act as a localization engineer performing triage on corrupted structured data assets across JSON, YAML, and Android XML. You will identify syntax errors that crash software parsers—including unescaped inner quotes, tab characters in YAML files, and unescaped ampersands in XML resource files—and repair them using Visual Studio Code diagnostic tools.

Required Setup & Prerequisites

  • Editor: Visual Studio Code installed.

  • Working Directory: Open your loc_lab working directory in VS Code.

Step-by-Step Instructions

Step 1: Create Corrupted Production Assets

To simulate real-world localization delivery defects, create three corrupted files containing broken data structures.

  1. Open VS Code and navigate to your assets/loc/ workspace.

  2. Inside assets/loc/software/, create broken_ui.json and paste:

    JSON

    json
    { "btn_confirm": "Press "Submit" to continue", "status_ok": "Operation completed successfully", }
  3. Inside assets/loc/games/, create broken_config.yaml and paste (make sure line 3 uses a Tab character for indentation instead of spaces):

    YAML

    game_settings:
      title: "Shadow Realm"
    	dialogue_speed: "Fast"
      sound_volume: 80
    
  4. Inside assets/loc/mobile/, create broken_strings.xml and paste:

    XML

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string name="app_name">AT&T Account Center</string>
        <string name="welcome_msg">Welcome <username> back!</string>
    </resources>
    
  5. Save all three files (Cmd + S on macOS / Ctrl + S on Windows).

Step 2: Triage & Repair Asset #1 — Corrupted JSON (broken_ui.json)

  1. Open assets/loc/software/broken_ui.json in VS Code.

  2. Open the Problems Panel in VS Code:

    • macOS: Press Cmd + Shift + M

    • Windows: Press Ctrl + Shift + M

  3. Notice two distinct linter errors in the Problems panel:

    • Line 2: Property value expected / unexpected inner quotes around "Submit".

    • Line 3: Trailing comma error after "Operation completed successfully".

  4. Remediation:

    • Escape inner quotes on line 2 using backslashes: "Press \"Submit\" to continue"

    • Remove the illegal trailing comma on line 3.

  5. Format the document (Option + Shift + F / Alt + Shift + F).

  6. Save the clean file as clean_ui.json:

    JSON

    {
      "btn_confirm": "Press \"Submit\" to continue",
      "status_ok": "Operation completed successfully"
    }
    

Step 3: Triage & Repair Asset #2 — Corrupted YAML (broken_config.yaml)

  1. Open assets/loc/games/broken_config.yaml in VS Code.

  2. Ensure Language Mode is set to YAML in the Status Bar (bottom right).

  3. Inspect line 3 in the Problems Panel:

    • Error: Tab characters are not allowed in YAML.

  4. Remediation:

    • Toggle white-space visibility in VS Code (View $\rightarrow$ Appearance $\rightarrow$ or open Command Palette and type Toggle Render Whitespace).

    • Delete the tab character at the beginning of line 3 (dialogue_speed).

    • Replace it with 2 spaces to match the indentation level of lines 2 and 4.

  5. Save the repaired file as clean_config.yaml:

    YAML

    python
    game_settings: title: "Shadow Realm" dialogue_speed: "Fast" sound_volume: 80

Step 4: Triage & Repair Asset #3 — Corrupted XML (broken_strings.xml)

  1. Open assets/loc/mobile/broken_strings.xml in VS Code.

  2. Inspect the XML entity errors on lines 3 and 4:

    • Line 3: The bare ampersand (&) in AT&T violates XML entity reference rules.

    • Line 4: The unescaped <username> bracket sequence is misinterpreted by XML parsers as an unclosed HTML/XML element tag.

  3. Remediation:

    • Convert the bare ampersand on line 3 to its XML entity reference: AT&amp;T.

    • Convert the angle brackets on line 4 to entity references (&lt; and &gt;): Welcome &lt;username&gt; back!.

  4. Save the repaired file as clean_strings.xml:

    XML

    python
    <?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">AT&amp;T Account Center</string> <string name="welcome_msg">Welcome &lt;username&gt; back!</string> </resources>

Self-Verification Checklist

Check your remediated files against these QA criteria before completing Lab 4.1:

  • [ ] clean_ui.json contains valid backslash-escaped inner quotes (\"Submit\") and no trailing commas.

  • [ ] clean_config.yaml contains zero tab characters and passes YAML linter inspection.

  • [ ] clean_strings.xml uses valid XML entity references (&amp;, &lt;, &gt;).

  • [ ] VS Code Problems Panel displays 0 errors across all three clean assets.


Ready to move on?

Mark this lesson complete when you’re ready.

→ Sign in to track your progress