TYPO3-Headless / headless

TYPO3 Headless JSON API providing content for PWA application (e.g. javaScript apps like nuxt-typo3)
https://t3headless.io
GNU General Public License v2.0
159 stars 60 forks source link

v4.2.2 breakes Form json with "HEADLESS_INT_START<<" and ">>HEADLESS_INT_END" marker in TYPO3 v12 and PHP 8.2. #665

Closed Fanor51 closed 11 months ago

Fanor51 commented 12 months ago

Version(s)

PHP: 8.2.11 TYPO3: v12.4.7 Headless: v4.2.2

Descirption

Hello,

i updated the headless extension form v4.1.1 to v4.2.2 and every Page with a TYPO3 Forms formular breakes because of displaying ts cache keys.

f.E.

{"id":733,"type":"Standard","media":[],"meta":{"subtitle":"","abstract":"","description":"","keywords":"","robots":{"noIndex":false,"noFollow":false},"author":"","authorEmail":"","ogDescription":"","ogImage":{"publicUrl":"https:\/\/api.fordkoegler-headless.ddev.site\/fileadmin\/Contentseiten\/Startseite\/Koeg-OG-Image.png","properties":{"title":null,"alternative":null,"description":null,"link":null,"linkData":null,"mimeType":"image\/jpeg","type":"image","filename":"Koeg-OG-Image.png","originalUrl":"\/fileadmin\/Contentseiten\/Startseite\/Koeg-OG-Image.png","uidLocal":41857,"fileReferenceUid":8218,"size":"684 KB","dimensions":{"width":1200,"height":630},"cropDimensions":{"width":1200,"height":630},"crop":{"social":{"cropArea":{"x":0,"y":0,"width":1,"height":1},"selectedRatio":"1_91:1","focusArea":null}},"autoplay":null,"extension":"png"}},"twitterDescription":"","twitterCard":"summary","twitterImage":null,"title":"Werkstatt","ogTitle":"Werkstatt | Ford K\u00f6gler","twitterTitle":"Werkstatt | Ford K\u00f6gler","ogType":"website","jsonld":{"deactivateOrganisation":false,"deactivateLocalBusiness":false},"canonical":"\/werkstatt\/"},"categories":"","breadcrumbs":[{"title":"Startseite","link":"\/","target":"Ford K\u00f6gler","active":1,"current":0,"spacer":0,"hasSubpages":1},{"title":"Werkstatt","link":"\/werkstatt\/","target":"","active":1,"current":1,"spacer":0,"hasSubpages":1}],"appearance":{"layout":0,"backendLayout":"1","transparentheader":0,"footerLayout":-1},"content":{"colPos1":[{"id":8105,"type":"form_formframework","colPos":1,"categories":"","appearance":{"layout":"default","frameClass":"0","spaceBefore":"","spaceAfter":""},"content":{"link":{"href":"\/werkstatt\/?tx_form_formframework%5Baction%5D=perform&tx_form_formframework%5Bcontroller%5D=FormFrontend&cHash=a4af66a18782bccde1d3775ab438d6a1","target":null,"class":null,"title":null,"linkText":"733","additionalAttributes":[]},"form":"HEADLESS_INT_START<<
{"renderingOptions":{"submitButtonLabel":"Absenden","_originalIdentifier":"workshop"},"type":"Form","identifier":"workshop-8105","label":"Workshop","prototypeName":"standard","finishers":[{"identifier":"WorkshopFormAutoCrm","options":{"source":"Werkstatttermin","email":{"subject":"Werkstatttermin"}}},{"options":{"subject":"Ford K\u00f6gler \u2013 Werkstatttermin","recipients":{"{text-3}":"{text-1} {text-2}"},"senderAddress":"werkstatt@ford-koegler.de","senderName":"Ford K\u00f6gler","templateName":"Workshop","blindCarbonCopyRecipients":["kontakt@ford-koegler.de","jan.humm@brandung.de"]},"identifier":"GeneratedEmailToSender"},{"options":{"pageUid":734},"identifier":"BrandungJsonRedirect"}],"renderables":[{"renderingOptions":{"previousButtonLabel":"Previous step","nextButtonLabel":"Next step"},"type":"Page","identifier":"page-1","label":"Werkstatttermin vereinbaren","renderables":[{"properties":{"text":"Werkstatttermin vereinbaren"},"type":"StaticText","identifier":"statictext-1","label":"Werkstatttermin vereinbaren","renderingOptions":{"FEOverrideType":"StaticTextWorkshop"}},{"type":"GridRow","identifier":"gridrow-2","label":"Grid: Row","renderables":[{"properties":{"options":{"1":"Wartung\/Inspektion","2":"Reparatur","3":"Karosserie\/Unfallreparatur"},"elementDescription":"","fluidAdditionalAttributes":{"required":"required"},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"4"},"lg":{"numbersOfColumnsToUse":"4"},"xs":{"numbersOfColumnsToUse":"4"},"sm":{"numbersOfColumnsToUse":"4"},"md":{"numbersOfColumnsToUse":"4"},"xl":{"numbersOfColumnsToUse":"4"}}}},"type":"RadioButton","identifier":"radiobutton-1","label":"","defaultValue":1,"validators":[{"identifier":"NotEmpty"}]}]},{"type":"GridRow","identifier":"gridrow-1","label":"Grid: Row","renderables":[{"properties":{"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"6"},"md":{"numbersOfColumnsToUse":"12"},"lg":{"numbersOfColumnsToUse":"6"},"xl":{"numbersOfColumnsToUse":"6"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"placeholder":"Vorname","required":"required","minlength":"0","maxlength":"30"},"validationErrorMessages":[{"code":1238110957,"message":"Der Vorname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1269883975,"message":"Der Vorname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1428504122,"message":"Der Vorname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1238108068,"message":"Der Vorname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1238108069,"message":"Der Vorname darf nicht l\u00e4nger als 30 Zeichen sein."}]},"defaultValue":"","type":"Text","identifier":"text-1","label":"Vorname","validators":[{"identifier":"NotEmpty"},{"options":{"minimum":"0","maximum":"30"},"identifier":"StringLength"}]},{"properties":{"fluidAdditionalAttributes":{"placeholder":"Nachname","required":"required","minlength":"0","maxlength":"30"},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"6"},"md":{"numbersOfColumnsToUse":"12"},"lg":{"numbersOfColumnsToUse":"6"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"validationErrorMessages":[{"code":1238110957,"message":"Der Nachname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1269883975,"message":"Der Nachname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1428504122,"message":"Der Nachname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1238108068,"message":"Der Nachname darf nicht l\u00e4nger als 30 Zeichen sein."},{"code":1238108069,"message":"Der Nachname darf nicht l\u00e4nger als 30 Zeichen sein."}]},"defaultValue":"","type":"Text","identifier":"text-2","label":"Nachname","validators":[{"identifier":"NotEmpty"},{"options":{"minimum":"0","maximum":"30"},"identifier":"StringLength"}]},{"properties":{"fluidAdditionalAttributes":{"placeholder":"E-Mail Adresse","required":"required"},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"6"},"xl":{"numbersOfColumnsToUse":"6"},"lg":{"numbersOfColumnsToUse":"6"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"validationErrorMessages":[{"code":1221559976,"message":"E-Mail Format nicht korrekt."}]},"defaultValue":"","type":"Text","identifier":"text-3","label":"E-Mail Adresse","validators":[{"identifier":"NotEmpty"},{"identifier":"EmailAddress"}]},{"properties":{"fluidAdditionalAttributes":{"placeholder":"Telefonnummer","required":"required","minlength":"5","maxlength":"20"},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"6"},"xl":{"numbersOfColumnsToUse":"6"},"lg":{"numbersOfColumnsToUse":"6"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"validationErrorMessages":[{"code":1238110957,"message":"Telefonnummer muss zwischen 5 und 20 Zeichen lang sein."},{"code":1269883975,"message":"Telefonnummer muss zwischen 5 und 20 Zeichen lang sein."},{"code":1428504122,"message":"Telefonnummer muss zwischen 5 und 20 Zeichen lang sein."},{"code":1238108068,"message":"Telefonnummer muss zwischen 5 und 20 Zeichen lang sein."},{"code":1238108069,"message":"Telefonnummer muss zwischen 5 und 20 Zeichen lang sein."}]},"defaultValue":"","type":"Text","identifier":"text-4","label":"Telefonnummer","validators":[{"identifier":"NotEmpty"},{"options":{"minimum":"5","maximum":"20"},"identifier":"StringLength"}]},{"properties":{"elementDescription":"","gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"4"},"xl":{"numbersOfColumnsToUse":"4"},"lg":{"numbersOfColumnsToUse":"4"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"required":"required"}},"defaultValue":"","type":"Text","identifier":"text-5","label":"Marke","validators":[{"identifier":"NotEmpty"}]},{"properties":{"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"4"},"xl":{"numbersOfColumnsToUse":"4"},"lg":{"numbersOfColumnsToUse":"4"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"required":"required"}},"defaultValue":"","type":"Text","identifier":"text-6","label":"Modell","validators":[{"identifier":"NotEmpty"}]},{"properties":{"fluidAdditionalAttributes":{"required":"required"},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"4"},"xl":{"numbersOfColumnsToUse":"4"},"lg":{"numbersOfColumnsToUse":"4"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}}},"defaultValue":"","type":"Text","identifier":"text-7","label":"KFZ Kennzeichen","validators":[{"identifier":"NotEmpty"}]},{"properties":{"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"12"},"xl":{"numbersOfColumnsToUse":"12"},"lg":{"numbersOfColumnsToUse":"12"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"required":"required","placeholder":"TT.MM.JJJJ"}},"defaultValue":"","type":"Text","identifier":"text-8","label":"Geben Sie Ihren Wunschtermin ein","validators":[{"identifier":"NotEmpty"}]},{"defaultValue":"","type":"Textarea","identifier":"textarea-1","label":"Ihre Fragen und W\u00fcnsche an Ford K\u00f6gler","properties":{"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"required":"required"}},"validators":[{"identifier":"NotEmpty"}]},{"type":"LinkedCheckbox","identifier":"linkedCheckbox","properties":{"options":{"datenschutz":39},"gridColumnClassAutoConfiguration":{"viewPorts":{"xxl":{"numbersOfColumnsToUse":"12"},"xl":{"numbersOfColumnsToUse":"12"},"lg":{"numbersOfColumnsToUse":"12"},"md":{"numbersOfColumnsToUse":"12"},"sm":{"numbersOfColumnsToUse":"12"},"xs":{"numbersOfColumnsToUse":"12"}}},"fluidAdditionalAttributes":{"required":"required"}},"label":"Ihre Daten werden nicht an Dritte weitergegeben. Ich habe die Datenschutzerkl\u00e4rung gelesen. *","renderingOptions":{"FEOverrideType":"Checkbox"},"validators":[{"identifier":"NotEmpty"}]}]}]}],"persistenceIdentifier":"EXT:bra_projectfiles\/Configuration\/Plugin\/Form\/FormConfiguration\/workshop.form.yaml"}

>>HEADLESS_INT_END"}}]},"i18n":[{"languageId":0,"locale":"de_DE.utf8","title":"German","navigationTitle":"German","twoLetterIsoCode":"de","hreflang":"de-DE","direction":"ltr","flag":"flags-de","link":"\/werkstatt\/","active":1,"current":0,"available":1}],"slug":"\/werkstatt\/"}

image

You can see at the start of the form json -> HEADLESS_INT_START<< and the end >>HEADLESS_INT_END. I downgraded back to v4.1.1 and everything was fine.

Can you please check if there is something broke in v4.2.2 or if you can reproduce this so i know i dint break anything? I can deep dive into that too if there is any need. I have not yet looked into the the code from the v4.2.2 release so maybe i can see there something.

Best Regards Fabio

Fanor51 commented 12 months ago

I saw these changes from v4.1 to v4.2 -> https://github.com/TYPO3-Headless/headless/commit/fd4684acb785fed9205438a7d813654cfc550f40. Are here any migration stepps for forms or did there maybe went something wrong with the key shown above?

Best regard - Fabio

twoldanski commented 11 months ago

Hi @Fanor51, what value of "headless" in you have in your site configuration? By any chance you enabled mixed mode?

Fanor51 commented 11 months ago

Hello @twoldanski ,

what do you mean with value of "headless"? Here is my site config ->

base: '%env(BASE_DOMAIN)%'
frontendBase: '%env(FRONTEND_BASE_DOMAIN)%'
errorHandling:
  -
    errorCode: 404
    errorHandler: PHP
    errorPhpClassFQCN: Vendor\MySitePackage\Error\JsonErrorHandler
  - errorCode: 410
    errorHandler: PHP
    errorPhpClassFQCN: Vendor\MySitePackage\Error\JsonErrorHandler
languages:
  -
    title: German
    enabled: true
    languageId: 0
    base: /
    typo3Language: de
    locale: de_DE.utf8
    iso-639-1: de
    navigationTitle: ''
    hreflang: ''
    direction: ''
    flag: de
    solr_core_read: '%env(SOLR_CORE)%'
rootPageId: 2
routeEnhancers:
  ... my enhancer
routes:
  ... my routes
solr_enabled_read: true
solr_host_read: '%env(SOLR_HOST)%'
solr_path_read: '%env(SOLR_PATH)%'
solr_port_read: '%env(SOLR_PORT)%'
solr_scheme_read: '%env(SOLR_SCHEME)%'
solr_use_write_connection: false
websiteTitle: ''

We don´t have any translations if this was your question.

Thank you! Fabio

twoldanski commented 11 months ago

@Fanor51 thx. Please add headless flag you your yaml configuration with one of the values (1 => full headless site, 2 -> mixed (default fluid, json on Accept header). In configuration above you have now headless mode disabled, that is reason you have broken forms (in non-headless we do not process response to fix USER_INTs declarations)

Fanor51 commented 11 months ago

Hello @twoldanski ,

Thanks for you support. Your settings really fixes my issues with 4.2.2: image Now everything lgtm.

Thanks!