Skip to content

Commit

Permalink
Merge pull request #16699 from wordpress-mobile/gutenberg/refactor/ga…
Browse files Browse the repository at this point in the history
…llery-as-nested-image-blocks

Refactor Gallery as nested image blocks
  • Loading branch information
Antonis Lilis authored Jul 7, 2021
2 parents 5e3626a + 05c666a commit f604816
Show file tree
Hide file tree
Showing 2 changed files with 145 additions and 0 deletions.
4 changes: 4 additions & 0 deletions WordPress/WordPress.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -1728,6 +1728,7 @@
AB758D9E25EFDF9C00961C0B /* LikesListController.swift in Sources */ = {isa = PBXBuildFile; fileRef = AB758D9D25EFDF9C00961C0B /* LikesListController.swift */; };
ACBAB5FE0E121C7300F38795 /* PostSettingsViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = ACBAB5FD0E121C7300F38795 /* PostSettingsViewController.m */; };
ADF544C2195A0F620092213D /* CustomHighlightButton.m in Sources */ = {isa = PBXBuildFile; fileRef = ADF544C1195A0F620092213D /* CustomHighlightButton.m */; };
AEE0828A2681C23C00DCF54B /* GutenbergRefactoredGalleryUploadProcessorTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = AEE082892681C23C00DCF54B /* GutenbergRefactoredGalleryUploadProcessorTests.swift */; };
B03B9234250BC593000A40AF /* SuggestionService.swift in Sources */ = {isa = PBXBuildFile; fileRef = B03B9233250BC593000A40AF /* SuggestionService.swift */; };
B03B9236250BC5FD000A40AF /* Suggestion.swift in Sources */ = {isa = PBXBuildFile; fileRef = B03B9235250BC5FD000A40AF /* Suggestion.swift */; };
B0637527253E7CEC00FD45D2 /* SuggestionsTableView.swift in Sources */ = {isa = PBXBuildFile; fileRef = B0637526253E7CEB00FD45D2 /* SuggestionsTableView.swift */; };
Expand Down Expand Up @@ -6345,6 +6346,7 @@
ADE06D6829F9044164BBA5AB /* Pods-WordPressIntents.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-WordPressIntents.release.xcconfig"; path = "../Pods/Target Support Files/Pods-WordPressIntents/Pods-WordPressIntents.release.xcconfig"; sourceTree = "<group>"; };
ADF544C0195A0F620092213D /* CustomHighlightButton.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = CustomHighlightButton.h; sourceTree = "<group>"; };
ADF544C1195A0F620092213D /* CustomHighlightButton.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = CustomHighlightButton.m; sourceTree = "<group>"; };
AEE082892681C23C00DCF54B /* GutenbergRefactoredGalleryUploadProcessorTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GutenbergRefactoredGalleryUploadProcessorTests.swift; sourceTree = "<group>"; };
B03B9233250BC593000A40AF /* SuggestionService.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SuggestionService.swift; sourceTree = "<group>"; };
B03B9235250BC5FD000A40AF /* Suggestion.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Suggestion.swift; sourceTree = "<group>"; };
B0637526253E7CEB00FD45D2 /* SuggestionsTableView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; name = SuggestionsTableView.swift; path = Suggestions/SuggestionsTableView.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -14328,6 +14330,7 @@
9123471A221449E200BD9F97 /* GutenbergInformativeDialogTests.swift */,
FF0B2566237A023C004E255F /* GutenbergVideoUploadProcessorTests.swift */,
4629E4222440C8160002E15C /* GutenbergCoverUploadProcessorTests.swift */,
AEE082892681C23C00DCF54B /* GutenbergRefactoredGalleryUploadProcessorTests.swift */,
);
name = Gutenberg;
sourceTree = "<group>";
Expand Down Expand Up @@ -18410,6 +18413,7 @@
3F1AD48123FC87A400BB1375 /* BlogDetailsViewController+MeButtonTests.swift in Sources */,
08F8CD3B1EBD2D020049D0C0 /* MediaURLExporterTests.swift in Sources */,
D81C2F6220F89632002AE1F1 /* EditCommentActionTests.swift in Sources */,
AEE0828A2681C23C00DCF54B /* GutenbergRefactoredGalleryUploadProcessorTests.swift in Sources */,
E66969CD1B9E2EBF00EC9C00 /* SafeReaderTopicToReaderTopic.m in Sources */,
E6A215901D1065F200DE5270 /* AbstractPostTest.swift in Sources */,
D8BA274D20FDEA2E007A5C77 /* NotificationTextContentTests.swift in Sources */,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
import XCTest
@testable import WordPress

class GutenbergRefactoredGalleryUploadProcessorTests: XCTestCase {
struct ImageUploadJob {
let localId: Int32
let remoteId: Int
let localUrl: String
let remoteURL: String
let mediaLink: String
}

let oldPostContent = """
<!-- wp:gallery {"ids":[-708],"columns":1,"linkTo":"file"} -->
<figure class="wp-block-gallery columns-1 is-cropped">
<ul class="blocks-gallery-grid">
<li class="blocks-gallery-item">
<figure>
<a href="file:///usr/temp/image708.jpg">
<img src="file:///usr/temp/image708.jpg" data-id="-708" class="wp-image--708" data-full-url="file:///usr/temp/image708.jpg" data-link="https://files.wordpress.com/?p=-708"/>
</a>
<figcaption class="blocks-gallery-item__caption">
<p>Caption</p>
</figcaption>
</figure>
</li>
</ul>
</figure>
<!-- /wp:gallery -->
"""

let oldPostResultContent = """
<!-- wp:gallery {"columns":1,"ids":[708],"linkTo":"file"} -->
<figure class="wp-block-gallery columns-1 is-cropped">
<ul class="blocks-gallery-grid">
<li class="blocks-gallery-item">
<figure>
<a href="https://files.wordpress.com/708.jpg" >
<img src="https://files.wordpress.com/708.jpg" data-id="708" class="wp-image-708" data-full-url="https://files.wordpress.com/708.jpg" data-link="https://files.wordpress.com/?p=708" />
</a>
<figcaption class="blocks-gallery-item__caption">
<p>Caption</p>
</figcaption>
</figure>
</li>
</ul>
</figure>
<!-- /wp:gallery -->
"""

func imageBlockContent(localMediaId: Int32, localImageUrl: String) -> String {
return """
<!-- wp:image {"id":\(localMediaId)} -->
<figure class="wp-block-image"><img src="\(localImageUrl)" alt="" class="wp-image-\(localMediaId)"/></figure>
<!-- /wp:image -->
"""
}

func imageBlockResultContent(remoteMediaId: Int, remoteImageUrl: String) -> String {
return """
<!-- wp:image {"id":\(remoteMediaId)} -->
<figure class="wp-block-image"><img src="\(remoteImageUrl)" alt="" class="wp-image-\(remoteMediaId)"/></figure>
<!-- /wp:image -->
"""
}

func galleryBlock(innerBlocks: String, imageCount: Int) -> String {
return """
<!-- wp:gallery {"linkTo":"none","imageCount":\(imageCount)} -->
<figure class="wp-block-gallery blocks-gallery-grid has-nested-images columns-\(imageCount) is-cropped">
\(innerBlocks)</figure>
<!-- /wp:gallery -->
"""
}

func testRefactoredGalleryImageBlockProcessor() {
let job = ImageUploadJob(localId: -123456789, remoteId: 123456789, localUrl: "file:///usr/temp/123.jpg", remoteURL: "https://files.wordpress.com/123.jpg", mediaLink: "https://files.wordpress.com/?p=123")

let gutenbergImgPostUploadProcessor = GutenbergImgUploadProcessor(mediaUploadID: job.localId, serverMediaID: job.remoteId, remoteURLString: job.remoteURL)

let image = imageBlockContent(localMediaId: job.localId, localImageUrl: job.localUrl)
let refactoredGalleryContent = galleryBlock(innerBlocks: image, imageCount: 1)
let resultContent = gutenbergImgPostUploadProcessor.process(refactoredGalleryContent)
let imageResult = imageBlockResultContent(remoteMediaId: job.remoteId, remoteImageUrl: job.remoteURL)

let refactoredGalleryResultContent = galleryBlock(innerBlocks: imageResult, imageCount: 1)

XCTAssertEqual(resultContent, refactoredGalleryResultContent, "Post content should be updated correctly")
}

func testRefactoredGalleryBlockProcessor() {
let mediaJobs = [
ImageUploadJob(localId: -1, remoteId: 1, localUrl: "file:///usr/temp/1.jpg", remoteURL: "https://files.wordpress.com/1.jpg", mediaLink: "https://files.wordpress.com/?p=1"),
ImageUploadJob(localId: -2, remoteId: 2, localUrl: "file:///usr/temp/2.jpg", remoteURL: "https://files.wordpress.com/2.jpg", mediaLink: "https://files.wordpress.com/?p=2"),
ImageUploadJob(localId: -3, remoteId: 3, localUrl: "file:///usr/temp/3.jpg", remoteURL: "https://files.wordpress.com/3.jpg", mediaLink: "https://files.wordpress.com/?p=3")
]

var galleryInnerBlocks = ""
var galleryResultInnerBlocks = ""
for job in mediaJobs {
galleryInnerBlocks += imageBlockContent(localMediaId: job.localId, localImageUrl: job.localUrl) + "\n"
galleryResultInnerBlocks += imageBlockResultContent(remoteMediaId: job.remoteId, remoteImageUrl: job.remoteURL) + "\n"
}
let galleryBlockContent = galleryBlock(innerBlocks: galleryInnerBlocks, imageCount: mediaJobs.count)
let galleryResultBlockContent = galleryBlock(innerBlocks: galleryResultInnerBlocks, imageCount: mediaJobs.count)

var resultContent = galleryBlockContent

resultContent = mediaJobs.reduce(into: resultContent) { (content, mediaJob) in
let gallerydProcessor = GutenbergGalleryUploadProcessor(mediaUploadID: mediaJob.localId, serverMediaID: mediaJob.remoteId, remoteURLString: mediaJob.remoteURL, mediaLink: mediaJob.mediaLink)
let imageProcessor = GutenbergImgUploadProcessor(mediaUploadID: mediaJob.localId, serverMediaID: mediaJob.remoteId, remoteURLString: mediaJob.remoteURL)
content = gallerydProcessor.process(content)
content = imageProcessor.process(content)
}

XCTAssertEqual(resultContent, galleryResultBlockContent, "Post content should be updated correctly")
}

func testMixedOldRefactoredGalleryBlockProcessor() {
let mediaJobs = [
ImageUploadJob(localId: -708, remoteId: 708, localUrl: "file:///usr/temp/image708.jpg", remoteURL: "https://files.wordpress.com/708.jpg", mediaLink: "https://files.wordpress.com/?p=708"),
ImageUploadJob(localId: -1, remoteId: 1, localUrl: "file:///usr/temp/1.jpg", remoteURL: "https://files.wordpress.com/1.jpg", mediaLink: "https://files.wordpress.com/?p=1")
]
let job = mediaJobs[1]
let galleryInnerBlocks = imageBlockContent(localMediaId: job.localId, localImageUrl: job.localUrl) + "\n"
let galleryResultInnerBlocks = imageBlockResultContent(remoteMediaId: job.remoteId, remoteImageUrl: job.remoteURL) + "\n"
let galleryBlockContent = galleryBlock(innerBlocks: galleryInnerBlocks, imageCount: mediaJobs.count)
let galleryResultBlockContent = galleryBlock(innerBlocks: galleryResultInnerBlocks, imageCount: mediaJobs.count)
let postResultContent = oldPostResultContent + "\n" + galleryResultBlockContent
var resultContent = oldPostContent + "\n" + galleryBlockContent

resultContent = mediaJobs.reduce(into: resultContent) { (content, mediaJob) in
let gallerydProcessor = GutenbergGalleryUploadProcessor(mediaUploadID: mediaJob.localId, serverMediaID: mediaJob.remoteId, remoteURLString: mediaJob.remoteURL, mediaLink: mediaJob.mediaLink)
let imageProcessor = GutenbergImgUploadProcessor(mediaUploadID: mediaJob.localId, serverMediaID: mediaJob.remoteId, remoteURLString: mediaJob.remoteURL)
content = gallerydProcessor.process(content)
content = imageProcessor.process(content)
}

XCTAssertEqual(resultContent, postResultContent, "Post content should be updated correctly")
}
}

0 comments on commit f604816

Please sign in to comment.